chrome拡張機能での同期処理化


 

chrome.storageに保存したり、データを取り出す時に通常だと非同期処理になってしまい
変数などを代入したりて、次の処理で使う時に不便です。

で順番を処理をさせるためのasync , await 処理での書き方のメモです。

まずは、一連の流れの処理を関数化して、async として非同期関数にします。

そして、内部中の関数(chrome.storate操作など)をawait化します。

あとは、その流れの処理を実行します。

これがわかりやすいし、シンプルかな。

async function processDataV3() {
    try {
        // データを順番に保存
        await chrome.storage.local.set({ key1: 'value1' });
        console.log('key1 を保存しました');

        await chrome.storage.local.set({ key2: 'value2' });
        console.log('key2 を保存しました');

        // データを順番に取得
        const result1 = await chrome.storage.local.get('key1');
        console.log('key1 の値:', result1.key1);

        const result2 = await chrome.storage.local.get('key2');
        console.log('key2 の値:', result2.key2);
        
        // さらに必要な処理を順次実行
        // ...
        
    } catch (error) {
        console.error('エラーが発生しました:', error);
    }
}

// 関数を呼び出して処理を開始
processDataV3();

WEBプログム、WEBデザインなどの制作については、以下を御覧ください。

WEBプログム、WEBデザインなどの制作