Refused to load the script: https://apis.google.com/js/api.js - google-chrome-extension

I'm trying to implement firebase authentication for a chrome extension. I can sign in using email and password, but I can't get the social logins to work (google and facebook)
here is the error message:
Refused to load the script 'https://apis.google.com/js/api.js?onload=__iframefcb541553' because it violates the following Content Security Policy directive: "script-src 'self' blob: filesystem: chrome-extension-resource:". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.
manifest.json
{
"manifest_version": 2,
"name": "...",
"description": "...",
"version": "0.0.0.1",
"icons": {},
"background": {
"scripts": [
"event.js"
],
"persistent": true
},
"permissions": ["tabs", "https://*/*","activeTab"],
"browser_action": {
"default_title": "...",
"default_popup": "popup.html"
},
"content_scripts": [
{
"matches": ["*://*/*"],
"css": [],
"js": ["content.js"]
}
],
"content_security_policy": "script-src 'self' https://apis.google.com; object-src 'self';"
}
signin
handleSocialLogin(provider) {
return () => {
auth
.signInWithPopup(provider)
.then(user => {
this.props.onUserChange(user)
localStorage.setItem('user', JSON.stringify(user))
})
.catch(error => this.setState({ error }))
}
}

Related

Chrome Extension MV3: Uncaught ReferenceError: Worker is not defined

I am trying to convert from MV2 to MV3 and I am getting this error from the service worker error logs:
Service worker registration failed
Uncaught ReferenceError: Worker is not defined
Here is my MV3 settings:
`{
"manifest_version": 3,
"name": "Blah",
"description": "Blah",
"version": "1.0.0",
"minimum_chrome_version": "93",
"action": {
"default_icon": "logo.png",
"default_popup": "popup.html"
},
"background": {
"service_worker": "js/background.js"
},
"content_scripts": [
{
"matches": ["file://*/*", "http://*/*", "https://*/*"],
"js": ["js/content.js"],
"run_at": "document_start",
"all_frames": true
}
],
"icons": {
"16": "icon-16.png",
"48": "icon-48.png",
"128": "icon-128.png"
},
"content_security_policy": {
"extension_pages": "script-src 'self'; object-src 'self'; worker-src 'self'"
},
"permissions": [
"scripting",
"clipboardWrite",
"tabs",
"activeTab",
"notifications",
"webRequest",
"proxy",
"storage",
"unlimitedStorage",
"alarms"
],
"host_permissions": [
"http://*/",
"https://*/",
"<all_urls>"
],
"web_accessible_resources": [
{
"resources": ["js/injected.js"],
"matches": ["*://*/*"]
}
]
}`
And here is the backgound script:
import { browser } from "webextension-polyfill-ts";
import { Request } from "#src/types";
import Extension from "./extension";
const app: Extension = new Extension();
try {
app.initialize().then(async () => {
// eslint-disable-next-line #typescript-eslint/no-unused-vars
browser.runtime.onMessage.addListener(async (request: Request, _) => {
try {
const res = await app.handle(request);
return [null, res];
} catch (e: any) {
return [e.message, null];
}
});
} catch (error) {
console.log("Error in backgound!!1");
}
Is there any missing configs in the background script or the MV3 json file?
It is an old bug when using nested web-worker with chrome extensions which is not supported yet: https://bugs.chromium.org/p/chromium/issues/detail?id=31666
I found the solution here: https://stackoverflow.com/a/33991381/9058556
It was simply installing https://github.com/dmihal/Subworkers package and importing it in my background.js script at the top.
Thanks #norio-yamamoto for trying to help me with this.

Google extension - message listener not working

this is a bit of my code that I have currently
Manifest
{
"name": "hidden",
"manifest_version": 2,
"content_security_policy": "script-src 'self'; object-src 'self'",
"permissions": [
"activeTab",
"storage"
],
"version": "hidden",
"icons": {hidden},
"description": "hidden",
"browser_action": {hidden},
"content_scripts": [
{
"matches": [hidden],
"run_at": "document_start",
"js": [ "injected.js", "content.js"]
}
],
"web_accessible_resources": ["injected.js"],
"background": {
"scripts": ["background.js"],
"persistent": false
}
}
Injected.js
if (new RegExp(allowedUrls.join("|")).test(this._url))
{
console.log('test') <- I can see this message in console
chrome.runtime.sendMessage({interception: true});
}
Background.js
console.log("Atleast reached background.js") <- I can see that
chrome.runtime.onMessage.addListener(function (message, sender) {
console.log('inside listener') <- I cannot see that which means it doesn't get fired on message sent
if (message.interception) {
chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
chrome.tabs.sendMessage(tabs[0].id, {interception: true});
});
}
});
Can someone help me and tell me why it isn't working? My goal is to intercept XHR request in one file (injected.js), then receive that message on background.js and send that to another content.js file and do some stuff base on the response.

chrome.tabs.executeScript not working on amazon.com

the callback function never get called on amazon product pages, eg:
https://www.amazon.com/AmazonBasics-0188-3-PACK-Multipurpose-Scissors/dp/B01BRGU8R0/ref=sr_1_13?dchild=1&keywords=amazonbasics&pf_rd_p=9349ffb9-3aaa-476f-8532-6a4a5c3da3e7&pf_rd_r=14VHDM69CE2KAX6H70ED&qid=1596591703&sr=8-13
chrome.tabs.executeScript(tabId,
{
code: script,
allFrames: true,
},
function (result) {
console.log('run script result:', result);
sendReplyToQuicker(true, "", result, msg.serial);
})
as simple as only one line code will not getting result:
1;
When run this code on other site:
When run this code on amazon page, callback function nerver called:
The extension manifest.json (full code):
{
"name": "Quicker Chrome Connector",
"version": "0.3.1",
"manifest_version": 2,
"description": "Native message connector with Quicker application",
"background": {
"scripts": [
"main.js"
],
"persistent": false
},
"content_scripts": [
{
"matches": [
"<all_urls>"
],
"js": [
"jquery-3.5.1.min.js",
"content.js"
],
"all_frames": true
}
],
"icons": {
"128": "icon-128.png"
},
"browser_action": {
"default_popup": "popup.html"
},
"permissions": [
"nativeMessaging",
"tabs",
"<all_urls>",
"debugger"
],
"optional_permissions":[
"bookmarks",
"browsingData",
"topSites",
"downloads",
"history",
"pageCapture",
"cookies",
"sessions",
"management"
],
"content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self'",
"homepage_url": "https://getquicker.net"
}

TypeError: Cannot read property 'farewell' of undefined

I have a problem while making a chrome extension. It gives me an error "TypeError: Cannot read property 'farewell' of undefined". I was doing it by Chrome documentation.
Background script:
chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
chrome.tabs.sendMessage(tabs[0].id, {greeting: "hello"}, function(response) {
console.log(response.farewell);
});
});
Content script:
chrome.runtime.onMessage.addListener(
function(request, sender, sendResponse) {
console.log(sender.tab ?
"from a content script:" + sender.tab.url :
"from the extension");
if (request.greeting == "hello") sendResponse({farewell: "goodbye"});
});
Manifest:
{
"name": "Test",
"version": "0.0.1",
"description": "Test app",
"permissions": [ "background", "tts", "storage", "webNavigation", "activeTab", "tabs" ],
"background": { "scripts": ["my.js"] },
"browser_action": {
"default_popup": "my.html"
},
"content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self'",
"content_security_policy": "script-src 'self' http://localhost; object-src 'self'",
"content_scripts": [
{
"matches": ["http://*/*", "https://*/*"],
"css": ["mystyles.css"],
"js": ["autofill.js", "smart.js"]
}
],
"manifest_version": 2
}

Extension refused to load the font in manifest.json.1

Following is my manifest.json:
{
"name": "gitvote",
"version": "1.0",
"manifest_version": 2,
"description": "for git vote",
"icons": {
"128": "icons/icon.png"
},
"permissions": [
"https://github.com/*",
"https://gitlab.com/*",
"storage"
],
"optional_permissions": [
"<all_urls>"
],
"background": {
"scripts": [ "background.js" ],
"persistent": false
},
"content_security_policy": "script-src 'self' https://ajax.googleapis.com; object-src 'self'"
}
When I run it as a chrome extension, an error:
'Refused to load the font 'data:font/woff;base64,d09GRgABAAAAAJd6ABIAAAABdegAAAAAAACWIAAAAVoAAAKDAAAAA…SYUnjpYfcSDw49uhYFPVe8dHZcYGS7Cfk4MMJ7zwjznvGw3PMA2Oo6+tf/wpSdPlSR/ADe7uPx' because it violates the following Content Security Policy directive: "font-src assets-cdn.github.com".' in manifest.json.1 occurs.
I don't understand why the error occurs in manifest.json.1.
Thank you.

Resources