Chrome extension programmatic script injection error

我是研究僧i 提交于 2020-01-06 05:22:27

问题


Following up on a previous post, I am now trying to create a version of a Chrome extension that does not specify content_scripts: or matches: in the manifest.json file; instead the content script is to be injected programmatically by a en event triggered from the options page which prompts the user to grant optional permissions for executing the content script. The rationale is to be able to have the extension working on pages from hosts with different top-level domain names (see previous post for details). I have read the documentation on this and tried to connect the dots, but I'm not quite getting there.

Below is a demo version of what I have created so far. I manage to get the optional permissions request processed and the user prompt for granting that request shown (the alert "granted!" is displayed). However, when I try to have the message listener in background.js execute the script content.js (by removing the /* commented-out code */ there), I get the error message

Unchecked runtime.lastError: Cannot access contents of url "chrome-extension://[blah]/options.html". Extension manifest must request permission to access this host.

Any guidance as to what I have missed here would be most welcome.

I also have a second question: since I am using jQuery in the content.js script, do I have to execute the jQuery.js file as well in response to the granted permission, and if so, should that be done by adding another separate chrome.tabs.executeScript() command?

manifest.json:

{
  "manifest_version": 2, 
  "name": "My Extension",
  "version": "1",
  "description": "Demo extension",
   "options_page":"options.html",
   "background": {
    "scripts": ["background.js"],
    "persistent": false
  },        
  "optional_permissions":["tabs","https://*/*"],
  "permissions": ["activeTab","storage"]

  }

options.html:

<html>
<head> 
<style>
button#permreq{font-size:2em;}
</style>
</head>
<body>
<button id="permreq">Click this button to enable My Extension</button>
<script src="jQuery.js"></script>
<script src="options.js"></script>
</body>
</html>

options.js:

jQuery(function($){
  $(document).ready(function(){
    $("button#permreq").click(function(){    
        chrome.permissions.request({
          permissions: ['tabs'],
          origins: ["https://*/*"]
        }, function(granted) {
          if (granted) {
            chrome.runtime.sendMessage("granted");
          } else {
            alert("denied");
          }

      });
    });
  });
});

background.js:

chrome.runtime.onMessage.addListener(
    function(message, callback) {
      if (message == "granted"){
        /*chrome.tabs.executeScript({
          file: "content.js"
        });*/
        alert("granted!");//no errors as long as above code is commented out
      } else{
        alert("denied");
      }
  });

来源:https://stackoverflow.com/questions/59039717/chrome-extension-programmatic-script-injection-error

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!