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.
Using web_accessible_resources This ID is randomly generated for every browser instance. This prevents websites from fingerprinting a browser by examining the extensions it has installed. Note: In Chrome in Manifest V2, an extension's ID is fixed.
Web-accessible resources are files inside an extension that can be accessed by web pages or other extensions. Extensions typically use this feature to expose images or other assets that need to be loaded in web pages, but any asset included in an extension's bundle can be made web accessible.
You can just use chrome. runtime. getManifest() to access the manifest data - you don't need to GET it and parse it.
The manifest file uses JSON format to describe the important information about the extension. It contains fields that are required and recommended while others are optional depending on the extension you are building. name refers to the name of the extension and should be up to 45 characters.
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';
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
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With