javascript에서 localstorage setItem을 비동기식으로 실행하는 솔루션이 있습니까?

javascript에서 localstorage setItem을 비동기식으로 실행하는 솔루션이 있습니까?

토큰 기반 인증 확인 ionic 앱을 사용하여 토큰을 저장하는 데 시간이 걸리는 로컬 스토리지에 저장하고 다음 상태로 이동하는 것이 로컬 스토리지에서 값을 설정하는 비동기식 방법입니다.

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

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'));

SO 스니펫에서는 다음 명령어를 사용할 수 없으므로 repl.it에서 실행되는 것을 확인하십시오.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.it

"비동기"에 대한 주의사항

위의 다른 코드를 즉시 계속 사용해도 해당 코드가 실행되면 로컬 스토리지에 액세스하는 작업이 시작되고 동일한 스레드가 사용됩니다.따라서 백그라운드에서 실행되는 것이 아니라 JS 코드와 병렬로 실행됩니다.콜 스택이 비워질 때까지 작업이 지연될 뿐입니다.또한 해당 작업이 완료될 때까지 브라우저 컨텍스트에서 다른 이벤트를 처리하지 않습니다.예를 들어 GUI는 계속 차단됩니다.

병렬로 접근해야 하는 경우 이 기능을 사용할 수 없게 됩니다.localStorage예를 들어 이 API는 Web Workers에서는 사용할 수 없습니다.Web Workers에서는 사용할 수 없습니다.그렇지 않았다면 이 API를 사용할 수 없었을 것입니다.

다른 방법으로 를 조사할 수 있습니다.단,

• 작업하는 것이 훨씬 더 복잡합니다.
• 비동기 인터페이스를 탑재하고 있습니다만, 몇개의 브라우저 실장에서는 아직 DOM이 차단되고 있습니다(따라서 위의 코멘트가 적용됩니다).
• IndexedDB는 웹 워커가 사용할 수 있기 때문에 병렬 처리가 개선되지만 구현이 더욱 복잡해집니다.

언급URL : https://stackoverflow.com/questions/42921220/is-any-solution-to-do-localstorage-setitem-in-asynchronous-way-in-javascript