启用了选项的内容脚本Chrome扩展程序没有后台页面? [英] Options-enabled content-script Chrome extension without background page?
问题描述
我正在为Google Chrome制作内容脚本扩展程序,它为网站页面添加了功能。我想添加几个选项,实际上并不是什么大问题,我只需要两个字符串(其中没有一个是敏感的用户数据)。
从这个答案,我认为我需要一个背景页面,我不想将它添加到我的扩展中 - 我不希望它获得不必要的权重。
我真的需要一个背景页面吗?或者我可以有一个没有它的选项页面(以及我可以使用哪个存储)?
更新
从Chrome 20开始,您现在可以使用Storage api .... 。
http://code.google.com/chrome/extensions /storage.html
旧方法
我所做的是创建一个指向页面在我的扩展中有一个脚本,它从本地存储获取我需要的设置,然后将它发送到它的父节点中, e内容脚本然后得到.....好,这是一个废话的解释,代码说它更好;).......
内容脚本
//为我们的页面创建iframe,发送设置
var el = document。的createElement( IFRAME);
el.setAttribute('src',chrome.extension.getURL(gimmeSettings.html));
el.style.visibility =hidden;
document.body.appendChild(el);
//创建一个监听来自我们页面的消息的发送设置的列表程序
window.addEventListener(message,receiveSettings,false);
//当我们从发送设置的页面收到消息时被调用的函数
function receiveSettings(event){
//检查以确保消息来自我们的页面
if(event.origin!==chrome-extension://+ chrome.i18n.getMessage(@@ extension_id))return;
//来自我们的扩展的消息,做一些事情
console.debug(event.data);
//清理
window.removeEventListener(message,receiveSettings,false);
el.parentNode.removeChild(el);
}
gimmeSettings.html的JS
//用我们的设置发布消息
parent.postMessage(localStorage.getItem(testing),*);
Options.html的JS
localStorage.setItem(testing,bleh);
清单
< pre $ {
name:从内容脚本获取扩展本地存储,
description:从本地存储获取扩展本地存储内容脚本请注意,其他页面/扩展程序可以使用它来获取您的设置,但不能更改它们......所以不包含敏感数据。,
content_scripts:[
{
matches:[< all_urls>],
js:[myscript.js],
run_at:document_idle
}
],
权限:[
标签,< all_urls>
],
manifest_version:2,
web_accessible_resources:[
gimmeSettings.html
,
options_page:options .html,
version:1.0
}
注意事项....
其他页面和扩展可以很容易地使用它来从你的扩展中获取设置,所以不要在这个方法中使用任何敏感数据。
从最好我可以告诉他们没有办法改变你的设置,通过这个页面,如果有人知道不同请详细解释。
使用清单版本2并设置页面gimmeSettings为可访问。如果你不知道差异清单版本2添加你真的应该阅读它... http://code.google.com/chrome/extensions/trunk/manifestVersion.html
如果你想要一个工作示例,那么去这里.....
http://论坛.valorsolo.com / viewtopic.php?f = 36& t = 375
I'm making a content script extension for Google Chrome, it adds functionality to a website's page. I want to add a couple of options, not big deal really, I'd just need two strings (none of which are sensitive user data).
From this answer, I assume I need a background page, which I'd rather not add to my extension - I don't want it to gain unnecessary weight.
Do I really need a background page, or I could have an options page without it (and which storage could I use)?
UPDATE
As of Chrome 20 you can now use the Storage api.....
http://code.google.com/chrome/extensions/storage.html
Old way
What I do is create an iframe that points to a page in my extension that has a script that gets the settings I need from local storage and then sends that to its parent in a message which the content script then gets.....well that was a crap explanation, the code says it better ;).......
Content Script
// create the iframe for our page that sends the settings
var el = document.createElement("iframe");
el.setAttribute('src', chrome.extension.getURL("gimmeSettings.html"));
el.style.visibility="hidden";
document.body.appendChild(el);
// create the listner that listens for a message from our page that sends the settings
window.addEventListener("message", receiveSettings, false);
// function that gets called when we recieve a message from the page that sends the settings
function receiveSettings(event) {
//check to make sure the message came from our page
if (event.origin !== "chrome-extension://"+chrome.i18n.getMessage("@@extension_id")) return;
//message came from our extension, do stuff with it
console.debug(event.data);
// clean up
window.removeEventListener("message", receiveSettings, false);
el.parentNode.removeChild(el);
}
gimmeSettings.html's JS
// post the message with our settings
parent.postMessage( localStorage.getItem("testing"), "*" );
Options.html's JS
localStorage.setItem("testing","bleh");
Manifest
{
"name": "Getting at an extensions local storage from a content script",
"description" : "Getting at an extensions local storage from a content script. Be aware that other pages/extensions can use this to get at your settings, but not change them...so dont include sensitvie data.",
"content_scripts": [
{
"matches": ["<all_urls>"],
"js" : ["myscript.js"],
"run_at":"document_idle"
}
],
"permissions": [
"tabs", "<all_urls>"
],
"manifest_version": 2,
"web_accessible_resources": [
"gimmeSettings.html"
],
"options_page": "options.html",
"version":"1.0"
}
Some things to note....
Other pages and extensions can easily use this to also get the settings from your extension, so dont use any sensitive data with this method.
From the best I can tell there is no way for them to alter your settings through that page tho, if anyone knows different please explain.
Im using manifest version 2 and have set the page gimmeSettings to be accessible. If you dont know the differences manifest version 2 add you really should read up on it.... http://code.google.com/chrome/extensions/trunk/manifestVersion.html
And if you want a working example then go here.....
http://forum.valorsolo.com/viewtopic.php?f=36&t=375
这篇关于启用了选项的内容脚本Chrome扩展程序没有后台页面?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!