打开chrome扩展程序后,浏览器页面无法点击吗?

时间:2018-08-06 07:49:35

标签: javascript angular google-chrome google-chrome-extension

打开chrome扩展程序后,我无法在网页上进行任何明智的点击,只能使“ href”点击其他任何内容。

我要在下面添加清单

{
  "manifest_version": 2,

  "name": "DEV Demo",
  "short_name" : "DEV Demo",
  "description": "this extension is fab",
  "version": "1.0.0",

  "icons": { 
    "16": "assets/icon16.png",
    "48": "assets/icon48.png",
    "128": "assets/icon128.png" 
  },

  "homepage_url": "https://www.example.io/",
  "browser_action": {
    "default_icon": "assets/icon128.png",
    "default_title": "DEV Demo"
  },
  "options_ui": {
    "page": "options.html",
    "chrome_style": true,
    "open_in_tab": true
  },
  "permissions": [
    "cookies", "storage", "tabs",  "http://*/*", "https://*/*", "background"
  ],
  "background": {
    "page": "background.html",
    "persistent": false
  },
  "content_security_policy": "img-src * 'self' data: https:; script-src 'self' 'unsafe-eval' https://www.googletagmanager.com https://www.google-analytics.com https://connect.facebook.net; object-src 'self'",
  "web_accessible_resources": [ "index.html", "index-mini.html", "https://www.example.io/" ],
  "content_scripts": [{
    "js": [ 
      "demo-install.js" , "content_mini.js"
    ],
    "matches": [ "*://*/*" ],
    "run_at": "document_idle"
  }]
}

我的扩展程序在iframe中打开,我通过内容脚本在iframe中打开它,因此我可以访问页面的一半,我可以在点击类型为href的位置进行点击,它会在新标签页上显示,但可以执行其他操作,例如添加到购物车,输入框等无效。

在内容脚本中,我添加了一个html元素,并在其中添加了iframe,并在iframe中运行了我的Angular应用程序,这是真正的扩展

var demo = '<div id="demo-holder" style="z-index:99999999999 !important;position:fixed;top:0;right:0;width:450px;height:620px;padding:0;margin:0;display:block !important;">'+
        '<iframe id="demo-iframe" allow="geolocation" style="z-index: 99999999999 !important; position: fixed; top: 0px; right: 0px;width:450px;height:620px;padding: 0px; visibility: visible;border-width:0px;display:block !important;">'+
        '</iframe>'+
    '</div>';
    document.querySelector('body').innerHTML += demo;
    var iFrame = document.getElementById('demo-iframe');
    iFrame.src  = chrome.extension.getURL ("index.html");
    document.getElementById('demo-holder').insertBefore (iFrame, document.getElementById('demo-iframe'));

我有一个后台JS,它会执行一些操作来更新扩展程序图标上的数字

0 个答案:

没有答案