Chrome拡張機能の他のスクリプトにオプションを適用する

Question

私は最初のChrome拡張機能を作成していて、「オプション」を設定して使用するにはレンガ壁に当たっています。私はオプションのページを設定する方法を学ぶためにGoogleのドキュメントを使い、拡張機能のデフォルトのポップアップとして設定しました。

は、ここに参照のための私のマニフェストです：私のスクリプトファイル（script.js）をロード

var s = document.createElement('script'); 
    s.src = chrome.extension.getURL('script.js'); 
    s.onload = function() { 
     this.remove(); 
    }; 
    (document.head || document.documentElement).appendChild(s); 

：

{ 
    "manifest_version": 2, 

    "name": "MyExtension", 
    "description": "MyDescription", 
    "version": "0.0", 
    "options_page": "options.html", 
    "browser_action": { 
     "default_icon": "on.png", 
     "default_popup": "options.html", 
     "default_title": "Manage Tools!" 
    }, 

    "permissions": [ 
    "storage", 
    "tabs", 
    "activeTab", 
    "https://ajax.googleapis.com/" 
], 

    "content_scripts": [{ 
     "matches": ["specialURL.com*"], 
     "js": ["jquery-3.1.1.min.js", "content.js"] 
}], 

    "web_accessible_resources": [ 
    "script.js" 
], 
    "background": { 
     "scripts": ["background.js"] 
    } 
} 

マイcontent.jsページには、以下が含まれています。 script.jsの内側に二つの方法

function foo() { -code- } 
function bar() { -code- } 

がありますoptions.js：

function save_options() { 
    var alltoggle = document.getElementById('alltoggle').checked; 
    var footoggle = document.getElementById('footoggle').checked; 
    var bartoggle = document.getElementById('bartoggle').checked; 
    chrome.storage.sync.set({ 
     allsetting: alltoggle, 
     foosetting: footoggle, 
     barsetting: bartoggle 
    }, function() { 
     // Update status to let user know options were saved. 
     var status = document.getElementById('status'); 
     status.textContent = 'Options saved.'; 
     setTimeout(function() { 
      status.textContent = ''; 
     }, 750); 
    }); 
} 
// Restores select box and checkbox state using the preferences 
// stored in chrome.storage. 
function restore_options() { 
    // Default to true 
    chrome.storage.sync.get({ 
     allsetting: true, 
     foosetting: true, 
     barsetting: true 
    }, function (items) { 
     document.getElementById('alltoggle').checked = items.allsetting; 
     document.getElementById('footoggle').checked = items.foosetting; 
     document.getElementById('bartoggle').checked = items.barsetting; 
    }); 
} 
document.addEventListener('DOMContentLoaded', restore_options); 
document.getElementById('save').addEventListener('click', save_options); 
document.addEventListener('DOMContentLoaded', function() { 
    document.querySelector('#alltoggle').addEventListener('change', allHandler); 

    // Turn on/off all features 
    function allHandler() { 
     $("input:checkbox").prop('checked', $(this).prop("checked")); 
    } 
}); 

問題は、私は戻って設定をロードし、私のコンテンツのスクリプトに適用しようとしています。具体的には、私はどのようにその方法を見つけることができません。

Answer 1

は、私は、これはメッセージの問題だと思ったが、それはありませんでした最初は

を解決しました。 content.jsに以下を追加することで、自分の設定のストレージを確認してそこからコードを実行することができました。

var fooON; 
chrome.storage.sync.get("foosetting", function(result) { 
    fooON = result.foosetting; 
    //confirm 
    console.log(result.foosetting); 
}); 
var barON; 
chrome.storage.sync.get("barsetting", function(result) { 
    barON = result.barsetting; 
    //confirm 
    console.log(result.barsetting); 
}); 

はその後、2つのスクリプトにfoo()とbar()を分離することによって、私は同様の問題

することができますに直面し、他人のためなどif(fooOn){-inject foo()-}

を追加することにより、content.js選択にスクリプトインジェクションを作ることができますコンテンツスクリプトでchrome.storage.sync.get() API呼び出しを使用して、アクセスオプションをstorage.syncに保存しました。

var yourSetting; 
chrome.storage.sync.get("yourSetting", function(result) { 
    yourSetting = result.yourSetting; 
});