36

I have tried many ways( all documented procedures)to inject script into a specific page upon checking URL at onUpdated.addListener. Finally the below code with 'executescript' seems to work, but not perfectly. I could able to get alerts but can not able to find document elements of the page through getElementById/getElementsByName.

When I inspected the page, script is injected. But in error console I get:

Denying load of chrome-extension://jfeiadiicafjpmaefageabnpamkapdhe/js/Leoscript.js. Resources must be listed in the web_accessible_resources manifest key in order to be loaded by pages outside the extension.

Manifest.json:

{
  "name": "Leo Extension for Job Boards",
  "version": "1.6",
  "manifest_version": 2,
  "content_security_policy": "script-src 'self'; object-src 'self'",
  "description": "Leo Extension",
  "background": {
    "scripts": ["js/Leojshelper.js"],
    "persistent": true
  },
  "content_scripts": [
    {
      "matches": ["<all_urls>"],
      "js": ["js/eventPage.js"],
      "run_at" : "document_start"
    }
  ],
  "icons":{"48":"images/bob48.png", "128":"images/bob128.png"}, //Define any icon sizes and the files that you want to use with them. 48/128 etc.
  "browser_action": {
    "default_icon": "images/bob.png",       // What icon do you want to display on the chrome toolbar
    "default_popup": "LeoExtwatch.html"     // The page to popup when button clicked.
  },
  "permissions": [
    "tabs", "<all_urls>"      // "http://*/*","https://*/*"             // Cross Site Access Requests
  ],
   "web_accessible_resources": ["js/LeoScript.js"]
}

I have also given 'web_accessible_resources' permission to the script, but still no success. Code in background script:

chrome.tabs.onUpdated.addListener(function (tabId, changeInfo, tab) {
    if (changeInfo.status == 'complete') {
        if (tab.url.indexOf("in.yahoo") !== -1) {
            chrome.tabs.update(tabId, { url: "https://login.yahoo.com/config/mail?.intl=us" });
            chrome.tabs.executeScript(tabId, {
                code: "document.body.appendChild(document.createElement('script')).src='" +
    chrome.extension.getURL("js/LeoScript.js") + "';"
            }, null);

Code in LeoScript.js, which will be injected into specific page. 

$(document).ready(function () {
    alert('injected');
    document.getElementById('username').value='aaaaaaa';
});

Content Script :eventPage.js which I used to inject script.

var script = document.createElement('script');
    script.src = chrome.extension.getURL("js/Leoscript.js");
    (document.body || document.head || document.documentElement).appendChild(script);

Please point me at any changes in the above code that will solve the permission issues. Thanks in advance.

Denis L
  • 3,209
  • 1
  • 25
  • 37
Vineel Gogineni
  • 465
  • 2
  • 5
  • 8

4 Answers4

15

UPDATE: Finally figured out your problem. In eventPage.js, you tried to inject js/Leoscript.js, which is NOT whitelisted, instead of js/LeoScript.js (with a capital 'S'), which is whitelisted. Note that URLs are case-sensitive!

chrome.tabs.executeScript(tabId, {file: 'js/LeoScript.js'});

LeoScript.js: 

alert('injected');
document.getElementById('username').value='aaaaaaa';
mikemaccana
  • 110,530
  • 99
  • 389
  • 494
方 觉
  • 4,042
  • 1
  • 24
  • 28
  • 1
    @方 觉: Thanks for the response, tired it just now, but same result 'Denying load of LeoScirpt: Resources must be listed in the web_accessible_resources – Vineel Gogineni Dec 04 '12 at 06:11
  • 1
    I tried again and things seemed wierd. chrome.tabs.executeScript(tabId, {code: ...}) succeeded while chrome.tabs.executeScript(tabId, {file: ...}) failed (even though the code is all the same). – 方 觉 Dec 04 '12 at 11:26
  • 1
    Updated again. Please take a look. @VineelGogineni – 方 觉 Dec 04 '12 at 11:45
  • Thank you very much 方 觉, you just made my day by pointing to my silly mistake. Thanks again for your time – Vineel Gogineni Dec 04 '12 at 12:05
15

EDIT:

This is working version where combination of web_accessible_resources and Injection is used

manifest.json

{
"name":"Off Screen Tabs Demo",
"description":"This demonstrates Off Screen Tabs API",
"manifest_version":2,
"version":"1",
"permissions":["tabs","<all_urls>"],
"browser_action":{
    "default_icon":"screen.png",
    "default_popup":"popup.html"
},
 "web_accessible_resources": ["js/LeoScript.js"] ,
 "permissions":["tabs","<all_urls>"]
}

LeoScript.js

alert("Injected..");

popup.html

<html>
<head>
<script src="popup.js"></script>
</head>
<body>
</body>
</html>

popup.js*

document.addEventListener("DOMContentLoaded",function (){
    chrome.tabs.executeScript( {"file": "js/LeoScript.js"});
});

Let me know if you still have problem in getting it running

Sudarshan
  • 18,140
  • 7
  • 53
  • 61
  • Thanks Sudarshan, when I tried your solutuion I got _Error during tabs.executeScript: Failed to load file: "chrome-extension://jfeiadiicafjpmaefageabnpamkapdhe/js/LeoScript.js"._ May be I am doing something wrong while injecting script, as I am using content script: eventPage.js to inject code. – Vineel Gogineni Dec 04 '12 at 06:55
  • @VineelGogineni: Can you eliminate folder structure for `js/LeoScript.js` and keep it in root path. Use `{file: chrome.extension.getURL("LeoScript.js") }` after moving file to root path, check answer i have edited it – Sudarshan Dec 04 '12 at 06:57
  • I tried eliminating folder structure, but the same error appears and if I use _file: chrome.extension.getURL("LeoScript.js")_ I am not getting alert as well. – Vineel Gogineni Dec 04 '12 at 07:32
  • @VineelGogineni:I have edited my answer with a working version, take it as a reference and let me know if you still have problem – Sudarshan Dec 04 '12 at 08:32
  • I tried your code, it is working fine and there are no console errors, but I need to inject script to the DOM of another page, so that I can access its elements. That error will appear when you try to inject code into another page. – Vineel Gogineni Dec 04 '12 at 09:59
  • are you taking of `document.getElementById('username').value='aaaaaaa';` script which fails? – Sudarshan Dec 04 '12 at 10:10
  • Even if I take off `document.getElementById('username').value='aaaaaaa';`, the error will appear. The error appears only, when you try to inject script into another page, no matter whats in the injecting script. I think there should be some config settings to solve this permission issue. – Vineel Gogineni Dec 04 '12 at 10:31
  • @VineelGogineni: Do you have `"permissions":["tabs",""],` in your manifest? – Sudarshan Dec 04 '12 at 10:40
  • Yeah, I got permissions in the manifest file and I am using the above manifest file settings. – Vineel Gogineni Dec 04 '12 at 10:53
  • `script = document.createElement('script'); script.src = chrome.extension.getURL("js/Leoscript.js"); (document.body || document.head || document.documentElement).appendChild(script);` can not run, use programmatic injection instead – Sudarshan Dec 04 '12 at 10:57
  • Thank you very much Sudarshan, for all your efforts, finally the extension code is working with small changes 1.Changed Leoscript to LeoScript in Content script file and 2. using _window.onload_ instead of _$(document).ready_ to find DOM elements only after page loading – Vineel Gogineni Dec 04 '12 at 12:02
9

Many will land up on this page for this error because they have not included their images/web resources in the manifest.json file. The link to the api documentation is helpful, so sharing it: web resource in manifest

Lavixu
  • 1,348
  • 15
  • 20
1

For me the issue got resolved when I disabled an extension, it worked! This was the error code:

To solve this issue just go to chrome://extensions/ and search for the extension id (here it's "nllcnknpjnininklegdoijpljgdjkijc") and turn off that extension.

Afrad Ahsan
  • 11
  • 3