I am trying to use jquery to make a post ajax call and I have tried almost all the solutions on SO but none seem to work. My manifest is:
{"name": "__MSG_extName__",
"version": "0.1",
"manifest_version": 2,
"description": "__MSG_extDesc__",
"icons": {"16": "icon16.png", "128": "icon128.png"},
"background": {"persistent": false, "scripts": ["background.js"]},
"default_locale": "en",
"content_scripts": [
{
"matches": ["<all_urls>"],
"js": ["jquery-2.1.3.js"]
}
],
"permissions": ["contextMenus", "downloads", "downloads.open", "tabs", "http://*/*", "https://*/*"]}
The background.js file is like:
chrome.downloads.onCreated.addListener(function(downloadItem) {
console.log("Download Link is " + downloadItem.url)
chrome.tabs.executeScript(null, { file: "jquery-2.1.3.js" }, function() {
console.log("jquery is loaded");
var linkSync = {
"document": {
"downloadLink": downloadItem.url,
"isSynced": false},
"safe": true
};
$.post("url/to/post",
linkSync,
function( data ) {
console.log("Success" + data );
});
});
});
The error that I am getting is:
Download Link is http://www.mymp3song.com/files/download/id/33724
background.js:14 jquery is loaded
extensions::uncaught_exception_handler:8 Error in response to tabs.executeScript: ReferenceError: $ is not defined
at Object.callback (chrome-extension://kbhkaajolcelehoonafmkgaahfgphnok/background.js:22:2)
at chrome-extension://kbhkaajolcelehoonafmkgaahfgphnok/background.js:13:16
As you may see, I have added the jquery.js both programmatically and in the manifest but none seem to work. Even if I remove either of them it does not work. Can someone point to me what I should do to make it work?
If you want jQuery to function in your background page, you need to add it to the background page.
Both methods that you're trying to use are adding code to the content script context instead.
What you need is this:
"background": {
"persistent": false,
"scripts": ["jquery-2.1.3.js", "background.js"]
},
to load jQuery in your background page. Note that order matters.
I would recommend giving the Architecture Overview a look.
modify your your json to this and it will work for u
reference is Here
"content_scripts": [ {
"js": [ "jquery.min.js", "background.js" ],
"matches": [ "http://*/*", "https://*/*"]
}]
Related
I'm trying to intercept youtube requests response from a devtool panel and send it to the content or background script of a Chrome extension. but I can't get it to work.
There is loads of exemple online but most of them use Manifest V2 and I really want to make it work on V3.
I don't know which method to use for sending messages to the content or background script from the panel.js, nor do I know how to listen for incoming messages from the panel in those scripts.
And I don't know if I need to add more permissions in my manifest for this to work :
{
"manifest_version": 3,
"name": "Already Seen",
"version": "1",
"content_scripts": [
{
"matches": ["<all_urls>"],
"js": ["jquery-3.6.0.min.js", "content.js"],
"css": ["avatar.css"]
}
],
"devtools_page" : "devtools.html",
"action": {
"default_icon": "icon.png"
},
"background": {
"service_worker": "background.js"
},
"permissions": ["identity", "storage", "tabs", "webRequest"],
"host_permissions": ["https://www.youtube.com/", "https://youtube.com/"],
"externally_connectable": {
"matches": ["https://youtube.com/*"]
},
"oauth2": {
"client_id": "***************",
"scopes": [
"https://www.googleapis.com/auth/userinfo.email",
"https://www.googleapis.com/auth/userinfo.profile"
]
}
}
devtools.html
<script src="devtools.js"></script>
devtools.js
chrome.devtools.panels.create("Already Seen", "icon.png", 'panel.html');
panel.html
<html>
<body>
<script src="panel.js"></script>
</body>
</html>
panel.js
chrome.devtools.network.onRequestFinished.addListener((request) => {
request.getContent((body) => {
if (!request.request || !request.request.url) return;
// I NEED TO SEND THE MESSAGE HERE TO BACKGROUND.JS OR CONTENT.JS
});
});
I found another way of doing this by using the chrome.debbuger in the background script but it shows "... started debugging this browser" on top of every pages.
I have an extension that i'm trying to add content scrips alongside background scripts but it just says invalid when trying to temp load.
{
"description": "Creates tasks and calculates application incomplete date",
"manifest_version": 2,
"name": "Task Creator",
"version": "1.31",
"permissions": [
"http://*/*", "tabs", "https://*/*",
],
"icons": {
"48": "icons/page-48.png"
},
"web_accessible_resources": [
"style/popUpStyle.css",
"script/popUpTask.js",
"script/logicTaskFiller.js",
"js/autosize.js",
"style/jquery-ui.css",
"js/jquery-1.12.4.js",
"js/jquery-ui.js"
],
"content_scripts":{
"matches": ["*urlhere.com*"],
"js": ["comSendForm.js"]
},
"background": {
"scripts": ["background.js"]
},
"browser_action": {
"default_icon": "icons/page-32.png"
}
}
I'm not quite sure where i'm messing up. It works instantly after I take out the content scripts, but I'm doing multiple things with this extension and I really do need the content scripts to run on a certain page. Any help is appreciated.
error message
1477430058898 addons.webextension. ERROR Loading extension 'null': Reading manifest: Error processing content_scripts: Expected array instead of {"matches":["*://url.com/"],"js":["comSendForm.js"]}
The error that you are getting is that your manifest.json has the value of the content_scripts key as an Object. The value of the content_scripts key needs to be an Array of Objects, not just an Object.
In addition, you have the following problems:
The line:
"http://*/*", "tabs", "https://*/*",
should not have the trailing ,. This is actually reported as the first error, so you may have copied the contents of your manifest.json file inaccurately.
Your matches pattern is invalid. You probably wanted something like:
"matches": ["*://*.urlhere.com/"],
With all of those changes your manifest.json would look like:
{
"description": "Creates tasks and calculates application incomplete date",
"manifest_version": 2,
"name": "Task Creator",
"version": "1.31",
"permissions": [
"http://*/*", "tabs", "https://*/*"
],
"icons": {
"48": "icons/page-48.png"
},
"web_accessible_resources": [
"style/popUpStyle.css",
"script/popUpTask.js",
"script/logicTaskFiller.js",
"js/autosize.js",
"style/jquery-ui.css",
"js/jquery-1.12.4.js",
"js/jquery-ui.js"
],
"content_scripts": [
{
"matches": ["*://*.urlhere.com/"],
"js": ["comSendForm.js"]
}
],
"background": {
"scripts": ["background.js"]
},
"browser_action": {
"default_icon": "icons/page-32.png"
}
}
I'm beginner in writing extensions for Chrome and I'm solving some tasks to learn.
I want to alert the anything when I changed tab and/or URL of current tab. For testing I've added following lines to manifest file:
"background_page": "background.html",
"permissions": [
//"activeTab",
"tabs"
//"http://*/*",
//"https://*/*",
//"https://secure.flickr.com/"
],
But in chrome://extensions page it says
'background_page' requires manifest version of 1 or lower.
Full manifest.json:
{
"manifest_version": 2,
"name": "Remove unwanted adds",
"description": "This extension prevents your browser to load adds.",
"version": "1.0",
//"background": {
// "scripts": [ "background.js" ]
//},
"content_scripts": [
{
"matches": [ /*"localhost/dental/frontend/patient/signin"*/ "http://someurl" ], // change this to 192.168.5.20/login.html
//"css": [ "mystyles.css" ],
"js": [ /*"jquery.js", "myscript.js"*/ "mainscript.js" ]
}
],
"background_page": "background.html",
"permissions": [
//"activeTab",
//"background",
//"clipboardRead",
//"clipboardWrite",
//"storage",
"tabs"
//"http://*/*",
//"https://*/*",
//"https://secure.flickr.com/"
],
"browser_action": {
//"default_icon": "img/icon.png",
"default_popup": "popup.html"
}
}
I have also tried this method (source):
"content_scripts": [
{
"matches": [ /*"localhost/dental/frontend/patient/signin"*/ "http://someurl" ],
//"css": [ "mystyles.css" ],
"js": [ /*"jquery.js", "myscript.js"*/ "mainscript.js" ]
}
],
in mainscript.js I only wrote this line:
alert("navigated!");
I don't know but this one also not working when I'm navigating to that someurl.
So,
1) what's going wrong in my codes
2) what's the best way to solve this task?
Thanks.
You cannot have comments in json files. Json files are just for data
1)
'background_page' requires manifest version of 1 or lower.
To fix the problem causing this message, your manifest(in respect to background page) should look like this (source):
{
"name": "My extension",
...
"background": {
"page": "background.html"
},
...
}
Regarding your content script called mainscript.js not executing, I would first try to change the matches to cover all urls like this:
"matches": [ "<all_urls>" ]
If the content script starts working, then construct a pattern that would satisfy your needs with the rules mentioned here.
2) I suggest you look at chrome.tabs API especially the onCreated, onUpdated and onSelectionChanged events.
As you can see, I have a problem with onclick event in chrome extension and I need your help.
$(function jony() {
jQuery.each( jQuery('img'), function() {
jQuery(this).attr('src', 'urlimage');
});
});
chrome.browserAction.onClicked.addListener(function(tab) {
jony();
});
Manifest:
{
"manifest_version": 2,
"name": "Jonyzátor",
"description": "Change images on page to JoNy!",
"version": "1.0",
"browser_action": {
"default_icon": "icon.png",
"default_title": "Klikni na mě!"
},
"permissions": [
"activeTab",
"https://ajax.googleapis.com/"
],
"content_scripts": [ {
"js": [ "jquery.js", "jonyza.js"],
"matches": [ "http://*/*", "https://*/*"]
}]
}
The scope in which jony is defined is limited to $(); outside it's simply undefined.
function jony() {
jQuery.each( jQuery('img'), function() {
jQuery(this).attr('src', 'urlimage');
}
$(jony); // Will execute on page load
// and you can still use it here
I'm not sure it was the logic you intended - do you want it to run both at page load AND when you click?
You can't use browserAction API in content scripts. The proper place for it would be a background (or event) script, and then you can message your content script to do something.
I'd like to make a website that is not part of the chrome plugin but rather just uses some API that the plugin exposes to it. Is this possible and if so, how do I do it? I googled this question and was unable to find anything.
I'm trying to use content scripts but nothing happens. Can someone explain what's wrong here?
manifest.json
{
"manifest_version": 2,
"name": "Hello World Extension",
"description": "This extension prints hello world.",
"version": "1.0",
"background": {
"page": "background.html"
},
"browser_action": {
"default_icon": "img/icon.png",
"default_popup": "popup.html"
},
"content_scripts": [
{
"matches": ["http://locahost:8888/*"],
"js": ["EmotivAPI.js"]
}
]
}
EmotivAPI.js
var port = chrome.runtime.connect();
console.log("Hello?");
window.addEventListener("message", function (event) {
// We only accept messages from ourselves
if (event.source != window)
return;
if (event.data.type && (event.data.type == "FROM_PAGE")) {
console.log("Content script received: " + event.data.text);
port.postMessage(event.data.text);
alert("recieved!");
}
}, false);
js in the webpage
window.sayHello = function () {
window.postMessage({ type: "FROM_PAGE", text: "Hello from webpage!" }, "*");
}
console.log('Emotiv extension loaded.');
}
I'm calling window.sayHello() from the console
Content Scripts can help you in this case.
The content script will be injected into a page:
"content_scripts": [
{
"matches": ["http://www.google.com/*"], // try with "http://localhost:*/*" or "http://localhost:*"
"css": ["mystyles.css"],
"js": ["content_script.js"]
}
]
If you want to inject the code only sometimes, use the permissions field instead
/* in manifest.json */
"permissions": [
"tabs", "http://*/*"
],
In you extension html file, you can then execute the script by:
chrome.tabs.executeScript(null, {file: "content_script.js"});