Является ли любое решение сделать localstorage setItem асинхронным способом в javascript

использование ионного приложения Проверка подлинности на основе маркера, хранение маркера в localstorage требуется время для хранения между ним переходит в следующее состояние-это любое решение для асинхронного способа установки значения в localstorage

window.localStorage.setItem('ChemistloggedInUser', JSON.stringify(data))

1 ответов


localStorage является синхронным API. Вы могли бы отложить setItem выполнение метода с помощью Promise объект, дающий им асинхронное поведение:

const asyncLocalStorage = {
    setItem: function (key, value) {
        return Promise.resolve().then(function () {
            localStorage.setItem(key, value);
        });
    },
    getItem: function (key) {
        return Promise.resolve().then(function () {
            return localStorage.getItem(key);
        });
    }
};

// Demo
const data = Date.now() % 1000;
asyncLocalStorage.setItem('mykey', data).then(function () {
    return asyncLocalStorage.getItem('mykey');
}).then(function (value) {
    console.log('Value has been set to:', value);
});
console.log('waiting for value to become ' + data + 
            '. Current value: ', localStorage.getItem('mykey'));

посмотреть его работы на репл.это, так как фрагменты не позволяют использовать localStorage.

новые async/await синтаксис, это asyncLocalStorage можно написать так:

const asyncLocalStorage = {
    setItem: async function (key, value) {
        await null;
        return localStorage.setItem(key, value);
    },
    getItem: async function (key) {
        await null;
        return localStorage.getItem(key);
    }
};

repl.это

примечание об "асинхронном"

имейте в виду, что хотя вышеизложенное позволяет сразу же продолжить работу с другим кодом, как только этот код будет выполнен, задача доступа к локальному хранилищу запустится и будет использовать тот же поток. Так что это не похоже на то, что он работает в фоновом режиме, в параллельно С вашим собственным кодом JS. Это просто задержки задача, пока стек вызовов пуст.

Если вам нужен доступ, чтобы произойти параллельно, то вам не повезло с localStorage. Например, этот API не является доступно в Web Workers, что в противном случае было бы возможным выходом.

вы могли бы заглянуть в IndexedDB API в качестве альтернативы. Но:

  • гораздо сложнее работать с
  • хотя он имеет асинхронный интерфейс, несколько реализаций браузера по-прежнему блокировать DOM (таким образом, вышеуказанные комментарии применяются)
  • IndexedDB может использоваться веб-работником, что дает лучший параллелизм, но делает его еще более сложным для реализации.