Javascript 如果扩展名为'，则更新chrome.storage；s文件更改

我有一个浏览器，它使用

chrome.storage

来跟踪应用于页面内容的样式表。其中一个样式表是一个必需的默认样式表，如果用户的

Chrome.storage

中不存在该文件，我会从Chrome的扩展文件中加载它。这很有效

但是，我有时会使用不同的规则更新此默认样式表，以改进样式。当扩展运行时，它会检查默认的样式表是否存在，并找到样式表的旧版本-因此它不会从扩展的存储中加载任何内容。因此，用户仍在使用旧版本的样式表

在我的本地计算机上，我可以手动清空我的

chrome.storage

并加载新的存储，但我不能在它发布时通过扩展来实现这一点，因为我不想每次运行扩展时都清空它，也不想只知道chrome扩展文件中更新样式表的次数

我可以通过检查两个文件的每个字符来解决这个问题，比较它们是否相同，如果相同，则加载扩展名的样式表，但这似乎有些过分，而且容易出错

只有在不更改文件名的情况下更新扩展名的样式表时，才有更简单的方法更新

chrome.storage

的样式表吗？

如果你想看看我的实现，整个项目都是开源的。

有了一个，我用第二个

chrome.storage

空间提出了以下解决方案

我已经在检查用户的Chrome存储中是否存在样式表，如果不存在，则从扩展名的文件加载样式表。为了使其在更改时自动更新，我现在检查第二个

chrome.storage

空间，在检查是否从chrome的存储中加载样式表时，该空间保存一个版本号。基本方法如下：

// Helper function that checks whether an object is empty or not
function isEmpty(obj) {
    return Object.keys(obj).length === 0;
}

var stylesheetObj = {}, // Keeps track of all stylesheets
    stylesheetVersion = 1; // THIS NUMBER MUST BE CHANGED FOR THE STYLESHEETS TO KNOW TO UPDATE

chrome.storage.sync.get('just-read-stylesheets', function (result) {
    // Here 'results' is an object with all stylesheets if it exists

    // This keeps track of whether or not the user has the latest stylsheet version
    var needsUpdate = false; 

    // Here I get the user's current stylesheet version
    chrome.storage.sync.get('stylesheet-version', function (versionResult) {

        // If the user has a version of the stylesheets and it is less than the cufrent one, update it
        if(isEmpty(versionResult) 
        || versionResult['stylesheet-version'] < stylesheetVersion) {

            chrome.storage.sync.set({'stylesheet-version': stylesheetVersion});

            needsUpdate = true;
        }

        if(isEmpty(result) // Not found, so we add our default
        || isEmpty(result["just-read-stylesheets"])
        || needsUpdate) { // Update the default stylesheet if it's on a previous version

            // Open the default CSS file and save it to our object
            var xhr = new XMLHttpRequest();
            xhr.open('GET', chrome.extension.getURL('default-styles.css'), true);
                // Code to handle successful GET here
            }
            xhr.send();
            return;
        }

        // Code to do if no load is necessary here
    });
});

//检查对象是否为空的Helper函数
函数isEmpty（obj）{
返回Object.keys（obj）.length==0；
}
var stylesheetObj={}，//跟踪所有样式表
stylesheetVersion=1；//必须更改此编号，样式表才能更新
chrome.storage.sync.get（'just-read-stylesheets'，函数（结果）{
//这里的“results”是一个包含所有样式表（如果存在）的对象
//这将跟踪用户是否具有最新的stylsheet版本
var needsUpdate=false；
//这里我得到了用户当前的样式表版本
chrome.storage.sync.get（'stylesheet-version'，函数（versionResult）{
//如果用户拥有样式表的一个版本，并且它小于cufrent版本，则更新它
如果（isEmpty）（版本结果）
||versionResult['stylesheet-version']

这使得为用户更新样式表所需更改的唯一内容是

stylesheetVersion

，确保它比以前的版本大。例如，如果我更新了样式表并希望用户的版本自动更新，我会将

stylesheetVersion

从

1

更改为

1.1

如果您需要更完整的实现，您可以找到JS文件，尝试使用并向其

*onChanged*

事件添加侦听器。每当存储中发生任何更改时，都会触发该事件。下面是用于侦听保存更改的示例代码：

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

---

这将侦听chrome存储，但我的问题是，当扩展名的文件发生更改时，我需要更新chrome的存储