I have the following manifest.json:
{
"manifest_version": 2,
"name": "Application Name",
"version": "1.0",
"description": "blah blah blah",
"icons": {
"48": "icons/icon-48.png",
"96": "icons/icon-96.png"
},
"permissions": [
"activeTab",
"tabs",
"history",
"storage"
],
"browser_action": {
"default_icon": "icons/icon-32.png",
"default_title": "Title",
"default_popup": "popup/popup.html"
},
"content_scripts": [{
"matches": [
"<all_urls>"
],
"js": [
"content_scripts/script1.js",
"content_scripts/script2.js"
]
}]
}
I have access to the the storage API (browser.storage is defined) in my content scripts, but both the history and tabs APIs (browser.tabs and browser.history) are undefined. Am I missing something in the manifest to get access to these permissions?
One of the few WebExtensions APIs that is available for content scripts is browser.storage. Most WebExtensions APIs can only be accessed when using a background script. Using message passing you can still call those APIs (what you do is basically calling a function in the background script from within the content script). Please see the example on this page: https://developer.mozilla.org/en-US/Add-ons/WebExtensions/API/runtime/sendMessage
See also Firefox WebExtention API: TypeError: browser.browserAction is undefined for a similar problem.
Related
I am creating a chrome extension. It injects a chat to the page of the user choice.
It works on all websites I checked but does not on a specific one.
I have a component called , when I click the button to inject the chat in the Popup.html it sends console.log to the page, from that component, but the component is not being rendered for some reason.
That's the page https://p.priority-connect.online/webui/P3A3E/
I tried to render it on another websites and it worked well.
Created console.log inside the component and received result inside the website console but not a rendered component.
that's my manifest file
{
"manifest_version": 3,
"name": "WhatsApp Chat",
"description": "A chrome extension boilerplate built with React 17, Webpack 5, and Webpack Dev Server 4",
"options_page": "options.html",
"background": {
"service_worker": "background.bundle.js"
},
"action": {
"default_popup": "popup.html",
"default_icon": "icon-34.png"
},
"icons": {
"128": "icon-128.png"
},
"content_scripts": [
{
"matches": [
"http://*/*",
"https://*/*",
"<all_urls>"
],
"js": [
"contentScript.bundle.js"
],
"css": [
"content.styles.css"
]
}
],
"devtools_page": "devtools.html",
"web_accessible_resources": [
{
"resources": [
"content.styles.css",
"icon-128.png",
"icon-34.png",
"assets/img/*"
],
"matches": [
"<all_urls>"
]
}
]
}
I try to develop my first chrome extension with react js. when I try to blocking a URL in the chrome extension using chrome.webRequest API In error page shows two errors.
'webRequestBlocking' requires manifest version of 2 or lower.
Unchecked runtime.lastError: You do not have permission to use blocking webRequest listeners. Be sure to declare the webRequestBlocking permission in your manifest.
and I'm declaring the "webRequestBlocking" permission in the manifest file. here is my manifest.json
{
"manifest_version": 3,
"name": "Chrome Extension",
"description": "First Extension",
"options_page": "options.html",
"background": {
"service_worker": "background.bundle.js",
"matches": [
"<all_urls>"
]
},
"action": {
"default_title": "Open Extension",
"default_icon": "icon-34.png"
},
"icons": {
"128": "icon-128.png"
},
"content_scripts": [
{
"matches": [
"http://*/*",
"https://*/*",
"<all_urls>"
],
"js": [
"contentScript.bundle.js"
],
"css": [
"content.styles.css"
]
}
],
"devtools_page": "devtools.html",
"web_accessible_resources": [
{
"resources": [
"content.styles.css",
"icon-128.png",
"icon-34.png"
],
"matches": []
}
],
"permissions": [
"activeTab",
"tabs",
"webRequest",
"webRequestBlocking"
],
"host_permissions": [
"<all_urls>"
]
}
here is my background.js
chrome.webRequest.onBeforeRequest.addListener(
function(details) {
console.log(details);
return {cancel: true};
},
{urls: ["https://reactjs.org/"]},
["blocking"]
);
and I have tried removing webRequestBlocking but also the same. can anyone help me is there a way to fix this?
the error explains it self 'webRequestBlocking' requires manifest version of 2 or lower. so you can't use webRequestBlocking in manifest version 3 .
but chrome is giving an alternative by using declarativeNetRequestWithHostAccess API witch is used to block or modify network requests by specifying declarative rules
you can check here for more details .
You can change manifest_version to 2 and webRequestBlocking to permissions.
I'm trying to use Chrome storage API to store access token after the user logs in the extension. However, when I try to use chrome.storage.local it throws error which says local was called on undefined.
I've added /* global chrome */ on the top of JS file in which I want to access the storage API. But the storage is still is not accessible.
As suggested in the documentation I've the storage permission added. Also, I've already tried multiple times to reload/reinstall the extension in chrome but the problem persists.
Following is my manifest file.
{
"manifest_version": 2,
"name": "My Extension",
"description": "This is My Extension",
"version": "1.0.0",
"homepage_url": "https://stylestash.dev",
"icons": {
"16": "ss-logo.png",
"48": "ss-logo.png",
"128": "ss-logo.png"
},
"browser_action": {
"default_icon": "ss-logo.png",
"default_title": "My Extension"
},
"background": {
"scripts": ["./jquery.js", "background.js"]
},
"content_scripts": [
{
"matches": ["<all_urls>"],
"all_frames": false,
"js": ["./content.js", "./jquery.js"],
"run_at": "document_end"
}
],
"permissions": ["storage", "tabs", "activeTab", "<all_urls>"],
"content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self'",
"web_accessible_resources": ["index.html", "/static/*"]
}
Any help would be very appreciated. Thanks!
I'm using the Firefox WebExtensions API with the following background script
var log = console.log.bind(console)
log('hello world from browser extension')
// https://developer.mozilla.org/en-US/Add-ons/WebExtensions/API/webRequest/onCompleted
var filter = { urls: '<all_urls>' }
var extraInfoSpec = ['tlsInfo', 'responseHeaders']
browser.webRequest.onCompleted.addListener(function(details){
log(`Woo got a request, here's the details!`, details)
}, filter, extraInfoSpec)
log('Added listener')
After loading the script from about:debugging, I see the following output in DevTools:
hello world from browser extension
I do not see any output- there is no data from browser.webRequest.onCompleted.addListener and there is no 'Added listener' message.
How do I make browser.webRequest.onCompleted work?
For completeness, my manifest.json is below:
{
"manifest_version": 2,
"name": "Test extension",
"version": "1.0",
"description": "Test extension.",
"icons": {
"48": "icons/border-48.png"
},
"content_scripts": [
{
"matches": ["<all_urls>"],
"js": ["content.js"]
}
],
"permissions": [
"webRequest",
"webRequestBlocking"
]
}
The webRequest API is only available to background scripts. You seem to using it inside a content script.
urls in var filter = { urls: '<all_urls>' } needs to be be an array ['<all_urls>'].
'tlsInfo' in extraInfoSpec doesn't exist, I don't know where it comes from.
You need to specify an additional <all_urls> permission in your manifest.
script.js
var filter = { urls: ['<all_urls>'] }
var extraInfoSpec = ['responseHeaders']
browser.webRequest.onCompleted.addListener(function(details){
console.log(`Woo got a request, here's the details!`, details)
}, filter, extraInfoSpec)
console.log('Added listener')
manifest.json
{
"manifest_version": 2,
"name": "Test extension",
"version": "1.0",
"description": "Test extension.",
"icons": {
"48": "icons/border-48.png"
},
"background": {
"scripts": ["script.js"]
},
"permissions": [
"webRequest",
"webRequestBlocking",
"<all_urls>"
]
}
it seems I can't get geolocation to work in FFOS 1.3.0. The default shipped "Here Maps" does Work but my App does not even ask for the Permission.
The Code does work on my Notebook, here I'm asked for the Location which is then provieded. I Guess it's the fault of the manifest file though I don't know what exactly is the Problem.
{
"version": "1.0",
"name": "Example",
"description": "Example",
"launch_path": "/index.html",
"icons": {
"16": "/images/icon_016.png",
"32": "/images/icon_032.png",
"48": "/images/icon_048.png",
"128": "/images/icon_128.png"
},
"developer": {
"name": "Example",
"url": "http://www.example.de"
},
"default_locale": "de",
"type": "privileged",
"permissions": {
"geolocation": {
"description": "Used to locate me"
}
}
}
Any help would be appriciated :)
I found the error. It seems to be needed to add
"installs_allowed_from": [
"*"
],
to the manifest file. My app does no ask for the permission and displays the location. Thank you all for your help :)