I want send message from webpage to chrome extension, but it not working. I see background function not receiving message send from content.js
Here:
manifes.json:
{
"name": "My Checker",
"version": "1.0",
"description": "http://www.abc.dev Extension!",
"manifest_version": 2,
"permissions": [
"*://*.google.com/",
],
"background": {
"scripts": ["background.js"],
"persistent": false
},
"content_scripts": [
{
"matches": ["*://*.abc.dev/*"],
"js": ["jquery-3.3.1.min.js", "content.js"],
"run_at": "document_end"
}
],
"externally_connectable": {
"matches": ["*://*.abc.dev/*"]
},
"browser_action": {
"default_popup": "popup.html"
}
}
And background.js:
console.log("background page in loading...");
chrome.runtime.onMessageExternal.addListener(
function(request, sender, sendResponse) {
console.log("listener for request");
console.log(request);
if (request.openUrlInEditor)
console.log("Open :" + request.openUrlInEditor);
sendResponse({success : "success"});
}
);
And content.js:
chrome.runtime.sendMessage("acldjllcapdfejdafbkjnfmpahdkendo", {openUrlInEditor: "https://www.google.com"}, function(response) {
if (response && !response.success)
handleError(url);
}
);
Cross-extension messaging.
you can use the messaging API to communicate with other extensions. This lets you expose a public API that other extensions can take advantage of.
Related
Alright I'm making my first chrome extension and I've ran into a bit of a problem:
manifest.json
{
"name": "...",
"description": "...",
"version": "1.0",
"manifest_version": 3,
"background": {
"service_worker": "background.js"
},
"permissions": [
"tabs",
"scripting",
"activeTab"
],
"host_permissions": [
"tabs",
"scripting",
"activeTab"
]
}
background.js
chrome.tabs.onUpdated.addListener(function(tabId, info, tab) {
if (info.status == 'complete') changeTheme(tab);
});
function changeTheme(tab) {
chrome.scripting.insertCSS({
target: {tabId: tab.id},
css: "h1 { color: #212121; }"
})
}
The extension devtool console logs this:
Error: Cannot access contents of url "long ass url". Extension manifest must request permission to access this host.
How would I "Request" permission?
"host_permissions" is for matching urls not for permissions.
Change this:
"host_permissions": [
"tabs",
"scripting",
"activeTab"
]
Into this:
"host_permissions": [
"https://example.org/foo/bar.html"
]
Or any other urls you want the extension to be available on (expect chrome://)
If you want the extension to be available on all sites use:
"host_permissions": [
"<all_urls>"
]
I have connected web page with the chrome extension. Collecting response in background.js. Following is my code:
manifest.json
{
"manifest_version": 2,
"name": "CIC Wallet",
"description": "The CIC Wallet in your browser",
"version": "1.0",
"browser_action": {
"default_icon": "Image/CI_logo-01.png",
"default_popup": "popup.html"
},
"icons": { "16": "Image/CI_logo-01.png",
"48": "Image/CI_logo-01.png",
"128": "Image/CI_logo-01.png"
},
"background":{
"scripts": ["background.js"]
},
"externally_connectable": {
"matches": ["http://127.0.0.1:5500/main.html"]
},
"web_accessible_resources": [
"popup.js", "background.js"
],
"permissions": [
"activeTab"
]
}
background.js
chrome.runtime.onMessageExternal.addListener(function(request, sender, sendResponse) {
console.log('from webpage');
window.open("popup.html", "CIC Notification", "width=357,height=600,status=no,scrollbars=yes,resizable=no");
document.getElementById("sendtrform").style.display="block";
});
main.js
window.addEventListener('load', function load(event){
var createButton = document.getElementById('btn_buy_trust');
createButton.addEventListener('click', function() {
var laserExtensionId = "myextID";
chrome.runtime.sendMessage(laserExtensionId, 'Hi from Webpage',
function(response) {
});
});
});
main.js is the js file from my webpage, on button click, I am sending the message. In background.js, I am collecting the response and opens my extension HTML file in the separate window. Here in background.js, I am not able to access HTML elements from the popup.html file.
I am getting an error for this line:
document.getElementById("sendtrform").style.display="block";
Can somebody help me, how can I access HTML elements from background.js?
I have page https://somepage in internet. Here is part of it's code from chrome code:
..............
<div class="wr">
<div class="auth_username">tesеDom#mail.com</div>
<div class="auth_stars">
<i class="fa fa-star-o fa-fw">
...........................
I have seen many answers and examples, but my code still not working. Seems I am missing something. My manifest:
{
"manifest_version": 2,
"name": "Bot_copy",
"version": "1.0",
"content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self'",
"icons": {
"48": "48x48.png",
"128": "128x128.png"
},
"content_scripts": [{
"matches": [ "https://mypage.my" ],
"js": ["helloWorld.js"]
}],
"permissions": [
"activeTab",
"alarms",
"clipboardRead",
"clipboardWrite",
"bookmarks",
"contextMenus",
"contentSettings",
"downloads",
"history",
"nativeMessaging",
"browsingData",
"proxy",
"webRequest",
"webRequestBlocking",
"cookies",
"tabs",
"webNavigation",
"storage",
"tabCapture",
"notifications",
"http://*/",
"https://*/",
"<all_urls>",
"unlimitedStorage",
"debugger"
],
"browser_action": {
"default_title": "Open"
},
"background": {
"scripts": ["background.js"]
}
}
content script
window.onload = function() {
sendMessage();
}
chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
sendResponse({
response: "Message received"
});
});
//Send message to background page
function sendMessage() {
//Construct & send message
chrome.runtime.sendMessage({
whattodo:"get_authname"
}, function(response) {
});
}
background
chrome.runtime.onMessage.addListener(
function(request, sender, sendResponse) {
var name = document.getElementsByClassName('auth_username').value;
alert(name);
sendResponse({
response: "Message received"
});
}
);
I received alert "undefined".
Have no idea. Really strange there are no properly documentation I don't understand object document.
Seems I miss how to use documentc object. I tried also document.getElementsByTagName('auth_username'), but it also not working. Which way is correct?
You can not access DOM from background script. You can access DOM from content script only. so try to place following code:
var name = document.getElementsByClassName('auth_username').value;
alert(name);
in contentscript and it works.
I'm using chrome messaging feature to send the filename and link to the background page
chrome.runtime.sendMessage({link: thelink, name:filename}, function(response) {});
The background.js
chrome.runtime.onMessage.addListener(function (message, sender, sendResponse) {
console.log(message.name);
chrome.downloads.download({
url: message.link,
filename: message.name,
conflictAction: 'prompt'
});
});
My manifest.json
{
"manifest_version": 2,
"name": "4ch",
"description": "This extension shows a Google Image search result for the current page",
"version": "1.0",
"icons": {
"16": "4ch-icon-16.png", "48": "4ch-icon-48.png", "128": "4ch-icon-48.png"
}
,
"permissions": ["downloads",
"<all_urls>",
"contextMenus"],
"content_scripts": [{
"js": ["script/jquery.js", "script/reddit.js"],
"matches": ["*://*.reddit.com/*"]
}
],
"background": {
"scripts": ["script/jquery.js","script/eventpage.js"], "persistent": false
}
}
the download only starts after a few seconds and doesn't change the file name
I have ofund a solution. The 'download master' extension was in conflict with my own,hence it doesn't replace the original filename.I have disabled it
after reading the tutorials I still can't make my extension to work after clicking on it, it starts working as soon as the page loaded.
Here is my manifest.
{
"manifest_version": 2,
"name": "My extension",
"description": "This extension bla bla.",
"version": "3.0",
"permissions": [
"tabs", "http://*/*", "https://*/*"
],
"browser_action": {
"default_icon": "icon.png"
},
"content_scripts": [
{
"matches": ["http://*/*"],
"js": ["make_changes.js"]
}
],
"background": {
"scripts": ["make_changes.js"],
"persistent": false
}
}
and here is my make_changes.js:
var oldSource = document.documentElement.innerHTML;
document.body.innerHTML = Make_change(oldSource);
function Make_change(source){
...
}
I've also got the background.HTML file, but it works without it. It seems that it is not correct:
chrome.tabs.executeScript(null, {file: "make_changes.js"});
You need to add a listener for the browser action onClicked event:
http://developer.chrome.com/extensions/browserAction.html#event-onClicked
chrome.browserAction.onClicked.addListener(function(tab) {
chrome.tabs.executeScript(tab.id, {file: "make_changes.js"});
});