Chrome扩展程序创建通过单击浏览器操作可访问的.html页面

2guxujil  于 5个月前  发布在  Go
关注(0)|答案(4)|浏览(74)

我一直在尝试浏览网页,但很难找到答案。我看到过一些网络扩展,如OneTab,当你点击“浏览器操作”按钮时,会打开本地index.html页面。有人知道如何让我的Chrome扩展在按下“浏览器操作”时打开index.html页面吗?

8ftvxx2r

8ftvxx2r1#

你应该看看chrome.browserAction和chrome.runtime.getURL。
manifest.json

{
    "name": "Your Extension Name",
    "description": "Your Extension Description",
    "version": "0.1",
    "manifest_version": 2,
    "background": {
        "scripts": ["background.js"],
        "persistent": false
    },
    "browser_action": {
         "title": "Your Browser Action Name"
    }
}

字符串
background.js

chrome.browserAction.onClicked.addListener(function () {
    chrome.tabs.create({ url: chrome.runtime.getURL("index.html") });
});

3zwtqj6y

3zwtqj6y2#

有两种方法可以通过浏览器操作打开本地HTML页面。

1.弹出

manifest.json

"browser_action":   {
                            "default_icon"  :   "128.png",
                            "default_popup" :   "localPage.html",
                            "default_title" :   "localPage title"
                        }

字符串

2.在Google Chrome浏览器中作为普通页面

manifest.json

"background": {
        "scripts": ["background.js"]
    },

后台.js

chrome.browserAction.onClicked.addListener(function () {
    chrome.tabs.create({ url: chrome.runtime.getURL("localpage.html") });
});

93ze6v8z

93ze6v8z3#

你的问题似乎有两个部分

1.响应browserAction点击事件

chrome.browserAction.onClicked.addListener(function () {
        // Your code here
    });

字符串

2.打开本地html页面

您可以通过chrome.runtime.getURL("index.html")获取本地页面URL
然后你可以使用chrome.tabs.create({ url: chrome.runtime.getURL("index.html") });打开本地的html页面。

mzmfm0qo

mzmfm0qo4#

现有的答案已经过时,不再适用于Manifest版本3。
在manifest.json中,你需要使用actionservice_worker

{
    ...
    "manifest_version": 3,
    "action": {},
    "background": {"service_worker": "background.js"}
}

字符串
(Note你需要"action",即使它是空的。
在background.js中,你需要使用chrome.action

chrome.action.onClicked.addListener(() => {
    chrome.tabs.create({
        url: chrome.runtime.getURL("index.html")
    });
});

相关问题