Chrome扩展程序:在扩展程序中管理多个html页面

时间:2013-05-13 21:04:20

标签: google-chrome-extension

我想在我的扩展程序中有几个html文件,所以我可以根据某些条件或事件打开它们。假设我想在用户在上下文菜单中选择一个选项时打开a.html。

我尝试了以下内容:

的manifest.json:

{
"name":  "My extension",
"version": "1.1",
"background": { "page": ["background.html"] },
"incognito": "split",
"permissions": ["tabs", "<all_urls>", "contextMenus"],
"icons": { "16": "images/16.png" },
"manifest_version": 2
}

background.html:

<!DOCTYPE html>
<html>
<head>
    <script src="background.js"></script>
    <script src='someWindow.js'></script>
</head>
<body>
</body>
</html>  

background.js:

var winID;
chrome.contextMenus.onClicked.addListener(function proccess_interested(info, tab){

    chrome.tabs.create({active: false}, function(newTab) {

    // After the tab has been created, open a window to inject the tab into it.
    chrome.windows.create(
        {
            tabId:      newTab.id,
            type:       "popup",
            url:        chrome.extension.getURL('a.html'),
            focused: true
        },function(window){
                 winID = newWindow.id;
          });
    });
})

chrome.extension.onMessage.addListener(function(Msg, sender, sendResponse) {

if(Msg.close_comment_win){
    chrome.windows.remove(winID, function(){});
}
});

someWindow.js:

function hide_win()
{
    chrome.extension.sendMessage({close_win: close}, function(response) {});
}

a.html:

<!DOCTYPE html>
<html>
<head>

<script src='someWindow.js'></script>

head     //with tags, can't show it here
body
<input type='button' value=' Cancel ' onclick="hide_win()"></input>

</body>
</html>

单击上下文菜单时会打开窗口,但是在点击取消时,它不会关闭。 console.log说:Refused to execute inline event handler because it violates the following Content Security Policy directive: "script-src 'self' chrome-extension-resource:".我想原因是a.html不是扩展的一部分,即使触发sendMessage的someWindow.js是扩展的一部分

通过清单在扩展名中包含a.html不是一个选项,因为只能包含一个背景html页面。

当然,如果不使用sendMessage将chrome.windows.remove(winID, function(){});直接放在hide_win()中,我会得到同样的效果。

任何想法如何完成这项工作?

1 个答案:

答案 0 :(得分:4)

正如错误所说,在扩展程序html页面中有任何内联代码,这与v2的content security policy相反。只需将该处理程序移动到js文件中即可正常工作。