Chrome扩展程序 - 写入不同域的本地存储

Question

如何写入不同域的本地存储。我的想法是，我需要我的Chrome扩展在本地存储中写入内容，并且当用户访问关联的网站时，站点站点可以读取本地存储的内容。我试图在用户的个人数据之间进行同步，而不必将其存储在服务器中。

Answer 1

我认为唯一的解决方案是通过跨域限制的脚本注入。

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

添加文件script.js您的分机访问其他网站的本地存储，你必须在你的清单文件添加到script.js“web_accessible_resources”。

请注意，在脚本完全加载后脚本会自动删除，因此请确保您要执行的代码包含在自执行功能中。

Answer 2

Content scripts直接访问页面的localStorage。

如果您想要存储特定域的值，只需打开一个窗口或框架，然后写入窗口/页面的本地存储。

1. 选择您喜欢的选项来激活页面：

   • chrome.tabs.create创建活动标签，也许在使用chrome.tabs.query发现的非活动窗口。
   • 实验offscreenTabs API（实验，所以没有准备好在生产中使用）。看到我发布在SO上的一些examples。
   • 创建一个IFrame并将其插入当前页面。
   • window.open（不推荐...）

   当你决定打开一个页面，挑选一个是重量轻。 /robots.txt通常是一个不错的选择：它存在于大多数网站上，和它是一个纯文本文件。

2. 激活页面的内容脚本。您可以使用清单文件并使用messaging API，或将回调添加到以编程方式插入内容脚本（chrome.tabs.executeScript）的chrome.tabs.create方法中。

下面是一个简单的例子。它需要tabs API，因为我使用的是chrome.tabs.executeScript。此外，您想访问的来源也应该添加到权限列表中。

chrome.tabs.create({ 
    active: false, 
    url: 'http://stackoveflow.com/robots.txt' 
}, function(tab) { 
    chrome.tabs.executeScript(tab.id, { 
     code: 'localStorage.setItem("key", "value");' 
    }, function() { 
     chrome.tabs.remove(tab.id); 
    }); 
});