Question

您好我正在尝试创建Chrome扩展程序，为了使我的应用程序可以扩展，我正在执行此步骤，

1.转到chrome选项 - ＆gt;更多工具 - ＆gt;扩展

2.我在该窗口中选择了开发者模式。

3.我选择了解压缩的扩展，然后选择了我的应用程序。

4.我点击了包扩展名。

在我的应用程序中，我有几个html页面，CSS，JS和清单文件以及background.js。

清单文件

{
    "name": "...",
    "description": "........",
    "manifest_version": 2,
    "minimum_chrome_version": "23",
    "version": "0.1.1",
    "offline_enabled": true,
    "icons": {
        "16": "sample.png"  
    },
    "permissions": [
    "storage","tabs","<all_urls>","webview"
    ],
    "app": {
        "background": {
            "scripts": ["background.js"]
        }
    }
}

background.js

chrome.app.runtime.onLaunched.addListener(function() {
  chrome.app.window.create('login.html', {
    id: 'main',
    bounds: { width: 1024, height: 768 }
  });
});

虽然包含选项卡的权限，但我收到以下警告，

There were warnings when trying to install this extension:
'tabs' is only allowed for extensions and legacy packaged apps, but this is a packaged app.

我的应用程序不被视为扩展程序。我正在尝试此页面导航。我通常在jquery中使用window.location.href="sample.html"。为此，我在Chrome扩展程序中收到错误

Use blank _target

然后我尝试使用这行代码，

function clickHandler(e){
  chrome.tabs.update({url:"service1.html"});
  window.close();
}
document.addEventListener('DOMContentLoaded',function(){
  document.getElementById('click-me').addEventListener('click',clickHandler);
});

这段代码也没有用。可以请一些人帮助我将我的应用作为扩展程序并帮助我进行页面导航。谢谢。

Answer 1

建议您查看Offical Guide for extensions，以下是基于您的要求的基本示例，当浏览器启动时（您的扩展程序也已执行），它将会打开login.html ，有一个登录按钮，一旦点击它，sample.html将会打开。

的manifest.json

{
    "name": "...",
    "description": "........",
    "manifest_version": 2,
    "minimum_chrome_version": "23",
    "version": "0.1.1",
    "icons": {
        "16": "sample.png"  
    },
    "background": {
        "scripts": ["background.js"]
    }
}

background.js

chrome.windows.create({url: "login.html"});

的login.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <button id="click-me">Click me</button>
    <script src="login.js"></script>
</body>
</html>

login.js

document.addEventListener("DOMContentLoaded", function() {
    document.getElementById("click-me").addEventListener("click", function() {
        window.location.href = "sample.html";    
    }, false);
});

在chrome扩展中使用什么而不是window.location.href？

1 个答案: