最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - Chrome Extension - Access iframe Elements - Stack Overflow

programmeradmin2浏览0评论

I'm appending an iframe to a page using content script with src set to chrome.extension.getURL(myPage). Later on some event, I want to retrieve some element from the frame. I tried the following code in content script:

var textFrame = document.getElementById('iframeId');
var text = (textFrame.contentDocument || textFrame.contentWindow.document).getElementById('someDivId');  

but it throws the following error:

Unsafe JavaScript attempt to access frame with URL chrome-extension://ipkjfhkdgodpcgpjepdjhcbfcbbbcpee/TopBar.html from frame with URL . Domains, protocols and ports must match.

In manifest file all_frames is set to true.

Please help me to resolve this.


Update: Here is a part of my manifest file:

 "permissions": [
   "tabs",
   "chrome://favicon/",
   "http://*/*", 
   "https://*/*"
 ],
 "background": {
    "scripts": ["Javascript/background.js"]
  },
 "content_scripts": [
  {
    "matches": ["http://*/*"],
    "js": ["Javascript/References/jquery-1.7.min.js","Javascript/content_script.js"],
    "run_at": "document_start",
    "all_frames": true
  }
 ],
  "web_accessible_resources": ["TopBar.html","Javascript/TopBar.js","Javascript/References/jquery-1.7.min.js"]

I'm appending an iframe to a page using content script with src set to chrome.extension.getURL(myPage). Later on some event, I want to retrieve some element from the frame. I tried the following code in content script:

var textFrame = document.getElementById('iframeId');
var text = (textFrame.contentDocument || textFrame.contentWindow.document).getElementById('someDivId');  

but it throws the following error:

Unsafe JavaScript attempt to access frame with URL chrome-extension://ipkjfhkdgodpcgpjepdjhcbfcbbbcpee/TopBar.html from frame with URL http://theInjectedPage./xxx/xxx/xxx. Domains, protocols and ports must match.

In manifest file all_frames is set to true.

Please help me to resolve this.


Update: Here is a part of my manifest file:

 "permissions": [
   "tabs",
   "chrome://favicon/",
   "http://*/*", 
   "https://*/*"
 ],
 "background": {
    "scripts": ["Javascript/background.js"]
  },
 "content_scripts": [
  {
    "matches": ["http://*/*"],
    "js": ["Javascript/References/jquery-1.7.min.js","Javascript/content_script.js"],
    "run_at": "document_start",
    "all_frames": true
  }
 ],
  "web_accessible_resources": ["TopBar.html","Javascript/TopBar.js","Javascript/References/jquery-1.7.min.js"]
Share Improve this question edited Jul 12, 2012 at 7:38 NaveenBhat asked Jul 9, 2012 at 12:37 NaveenBhatNaveenBhat 3,3264 gold badges40 silver badges48 bronze badges 6
  • is the code to get the element running in the content script, or background/popup.js? – Dan Smith Commented Jul 9, 2012 at 12:57
  • its running in content script. – NaveenBhat Commented Jul 9, 2012 at 13:01
  • Is the html file listed as web accessible in the manifest? code.google./chrome/extensions/… – Dan Smith Commented Jul 9, 2012 at 13:09
  • @Bulk - yes it is listed in web_accessible_resources. – NaveenBhat Commented Jul 9, 2012 at 13:14
  • @NaveenBhat Hi Naveen - Just wondering if you ever found the answer to this question. Thanks . David – David Dehghan Commented Sep 22, 2015 at 9:23
 |  Show 1 more ment

1 Answer 1

Reset to default 2

There is nothing wrong with your permissions, but i'm just wondering why you got this error from chrome that the page TopBar.html is trying to access the frame ?? are you creating the iframe via content_script? and what is the url you are giving to the iframe ?

you may check this code sample it injects in each page you are opening an iframe.

manifest.json

{
  "name":"example",
  "description": "",
  "version": "1.0",
  "manifest_version": 2,
  "permissions": [],
  "content_scripts": [
    {
      "all_frames": true,
      "matches": ["http://*/*","https://*/*"],
      "css": [],
      "js": ["content_script.js"]
    }]
}

and the content_script.js

var iframe= document.createElement("iframe");
iframe.setAttribute("width", "100%");
iframe.setAttribute("height", "200px;");
iframe.setAttribute("src", "http://gamalshaban.me/blog");
document.body.appendChild(iframe);

also I've uploaded this sample extension and you can download it from this link

发布评论

评论列表(0)

  1. 暂无评论