Chrome擴展選項.js通知content_script.js的設置更改

Question

什麼是正確的方式來通知我的content_script.js設置更改？

當我寫我的設置localStorage的我想要做的sendMessage/sendRequest將在內容腳本，因此可以相應地應用它們。

我必須要做的options.js> background.js> content_script.js

的思考？

options.js

$('#add-filter-button') 
    .button() 
    .click(function(event) { 
     event.preventDefault(); 
     var userFilters = new Array(); 
     var newFilter = $('#add-filter').val(); 
     if (newFilter !== undefined && newFilter.length > 0) { 
      $('#filters-box').append(new Option(newFilter, newFilter)); 
      $('#add-filter').val(''); 
      $('#filters-box option').each(function() { 
       userFilters.push($(this).text()); 
      }); 
      localStorage['userFilters'] = JSON.stringify(userFilters); 
      chrome.storage.sync.set({'userFilters': userFilters}); 
     } 
    }); 

content.js

chrome.storage.onChanged.addListener(function(changes, namespace) { 
    for (key in changes) { 
     var storageChange = changes[key]; 
     console.log('Storage key "%s" in namespace "%s" changed. ' + 
      'Old value was "%s", new value is "%s".', 
      key, 
      namespace, 
      storageChange.oldValue, 
      storageChange.newValue); 
     } 
}); 

Answer 1

使用chrome.storage.localhttps://developer.chrome.com/extensions/storage.html

它活動onChanged

例如：

個

settings.js

chrome.storage.sync.set({'value': theValue}); 

content.js

chrome.storage.onChanged.addListener(function(changes, namespace) { 
    for (key in changes) { 
    var storageChange = changes[key]; 
    console.log('Storage key "%s" in namespace "%s" changed. ' + 
       'Old value was "%s", new value is "%s".', 
       key, 
       namespace, 
       storageChange.oldValue, 
       storageChange.newValue); 
    } 
});