クロム拡張でイベントハンドラに設定がロードされるのを待ちます

Question

クロムのローカルストレージに保存されている設定（基本的に2つのフラグ）でクロム拡張を開発しています。私はこのようなオプションページに罰金保存した設定を保存し、取得することができます。

割引：

function save_options() { 
    var checkbox1checked = $("#checkbox1").prop("checked"); 
    var checkbox2checked = $("#checkbox2").prop("checked"); 
    chrome.storage.sync.set({ 
    checkbox1: checkbox1checked, 
    checkbox2: checkbox2checked 
    }, function() { 
    $("#status").text("Settings saved."); 
    window.setTimeout(function() { 
     $("#status").text(""); 
    }, 2000); 
    }); 
} 

を取得します。

function restore_options() { 
    chrome.storage.sync.get({ 
    checkbox1: true, 
    checkbox2: false 
    }, function(items) { 
    $("#checkbox1").prop("checked", items.checkbox1); 
    $("#checkbox2").prop("checked", items.checkbox2); 
    }); 
} 

そして、私のコンテンツのスクリプトに私が取得するための関数を書きましたが次のような設定です：

var checkbox1Checked = true; 
var checkbox2Checked = false; 
    function getSettings() { 
     chrome.storage.sync.get({ 
     checkbox1: true, 
     checkbox2: false 
     }, function(items) { 
     checkbox1Checked = items.checkbox1; 
     checkbox2Checked = items.checkbox2; 
     }); 
    } 

そして、私は 'pasのイベントハンドラを追加していますこのようなTE」イベント：

window.addEventListener('paste', handlePaste, true); 

そしてhandlePaste機能では、私はgetSettings（）関数を呼び出しています。しかし、問題は、イベントのさらなる論理は、イベントが拡張設定に基づいて取り消されるべきかどうかを決定することである。

私のロジックはgetSettings（）呼び出しの後ですが、私は貼り付けイベントの2回目の発生から正しい機能しか見ることができないので、変数が更新された値で初期化される前に実行されているようです。

私はどうにかして設定がロードされるのを待ってからイベントハンドラを実行する方法を探しています。私がすでに試したこと：

1. 設定検索のコールバックに自分のロジックを書き込もうとしました。しかし、コールバックの登録後にハンドラ関数が返され、非同期操作が進行中に追加のハンドラが実行され続け、後でイベントキャンセルが不可能になるため、これは機能しません。

2. 私は、設定がwindow.setTimeoutと他の同様のソリューションでロードされるのを無駄に待つことを試みました。

3. 設定を保存するときに、オプションのページからコンテンツスクリプトが実行されたすべてのページに何らかのメッセージを送信して、変更された設定を知らせることができました。私はまだこれを実装しようとはしていないし、これが可能なのかどうかはわかりません。

4. 私は何とかイベントをクローンしてから取り消そうとしましたが、設定がロードされたら、必要に応じて複製されたイベントを再開しました。しかし、私は最初にペーストイベントを複製することが困難でした。

この問題をどのように解決すればよいですか？何か助けていただければ幸いです。これが私の最初のChrome拡張機能（私は個人的に使用するために開発しています）です。

Answer 1

コンテンツスクリプトは、開始して終了するとすぐに設定を取得する必要があります。 chrome.storage.sync.get()コールのコールバック関数では、chrome.storage.onChanged.addListener()を使用してchrome.storage.onChangedイベントのイベントハンドラを追加して、取得した設定を最新の状態に保つ必要があります。取得した設定は、ペーストイベントハンドラがアクセスできる変数に格納する必要があります。そのため、常に設定の現在の値にアクセスできます。例えば

var checkbox1Checked, checkbox2Checked; 
chrome.storage.sync.get({ 
    checkbox1: true, 
    checkbox2: false 
}, function(items) { 
    checkbox1Checked = items.checkbox1; 
    checkbox2Checked = items.checkbox2; 
    chrome.storage.sync.onChanged.addListener(function(changes, area) { 
     if (area !== "sync") return; 
     if (changes.checkbox1) { 
      checkbox1Checked = changes.checkbox1.newValue; 
     } 
     if (changes.checkbox2) { 
      checkbox2Checked = changes.checkbox2.newValue; 
     } 
    }); 
    window.addEventListener('paste', handlePaste, true); 
}); 

今ペーストイベントハンドラがchrome.storage.sync.get()を呼び出すことなく、変数checkbox1Checkedとcheckbox2Checkedですぐ設定にアクセスすることができます。ハンドラは、chrome.storage.sync.get()コールバック関数に追加されているため、設定変数が初期化される前に呼び出すことはできません。