I have followed a few tutorials out there:
https://developer.chrome.com/apps/app_identity
https://github.com/GoogleDeveloperExperts/chrome-extension-google-apis
https://mashe.hawksey.info/2017/05/using-the-google-apps-script-execution-api-in-chrome-extensions/
to get my chrome extension to authenticate with a Google API project but this code:
chrome.identity.getAuthToken({ 'interactive': false }, function (token) {
// Catch chrome error if user is not authorized.
if (chrome.runtime.lastError) {
$("#__sample_support_logarea").text(chrome.runtime.lastError.message);
console.log('No token aquired');
console.log(chrome.runtime.lastError.message);
sampleSupport.log('No token aquired');
sampleSupport.log(chrome.runtime.lastError.message);
} else {
console.log('Token acquired');
console.log(token);
}
});
always returns:
OAuth2 request failed: Invalid credentials (credentials rejected by client).
Here is my manifest.json:
{
"manifest_version": 2,
"name": "Shopify Partners",
"description": "Automate Proposal Creation",
"version": "1.0",
"background": {
"scripts": [
"background.js"
]
},
"content_scripts": [
{
"js": [ "jquery.min.js", "main.js" ],
"matches": [ "http://*/*", "https://*/*" ]
}
],
"browser_action": {
"default_icon": "icon.png",
"default_popup": "popup.html"
},
"permissions": [
"activeTab",
"identity",
"https://accounts.google.com/*",
"https://www.googleapis.com/*"
],
"oauth2": {
"client_id": "..sr1t2ass4f9a0.apps.googleusercontent.com",
"scopes": [
"https://www.googleapis.com/auth/spreadsheets"
]
},
"key": "MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEAp8Cj7TI9toe9nK0Pw8FFk1hOlSCPUwJ/GUmWUgzyO3XBP2KoIFv+ISpOoPO++itYsDaXBgZzjk/EUeFMPUWbmuL6+lfs6orq39mMzQKLZEMV05bRaVVsj7gMtBGrsuOJm83Ugw+2tUVszH/yCzMFYNGqJe+ZaEPyUDVqeOfbZoo+JDleDveu0j+HTKDa6wVdDxndT+N86IEoPKCWfXdzMZ6+22ZTSPKYIvQbaHalqEQ9YAc80eHaL0eQNq/+aEv3oNWm2rbB8fy79koQKkZBuWJqgWmznWe6NzPkEpsiE+ilaUCKzWzFDFpiIC0A5Eq3KpWQdnQYDF1A2gmTh9vgkQIDAQAB",
"content_security_policy": "script-src 'self' https://apis.google.com https://ajax.googleapis.com; object-src 'self'"
}
Please note that I have omitted the complete client id here for security reasons.
The only thing that I suspect might be the reason for this is that I am running an unpacked extension in chrome dev mode which id is something like: gcnonhfkghlloailceiddfmlmdeajlkl
And in the Api Console when creating the credentials for the client I have specified the same:
Therefore I suspect that being an unpackaged extension might be comprising it. But publishing an extension in the Chrome store is a long process and certainly is not what is expected of such a simple task.
I think your extension id has changed. The same thing happened to me.
To fix this, I again created google OAuth 2.0 Client ID and it has been fixed.
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>"
]
With the new manifest v3 came the doom of webRequest and webRequestBlocking, how are we suppose to authenticate a proxy request?
Old way:
chrome.webRequest.onAuthRequired.addListener(function(details, callbackFn) {
callbackFn({
authCredentials: { username: username, password: password }
});
},{urls: ["<all_urls>"]},['asyncBlocking']);
So my question besides the one above is what is the new way of doing this? Docs say that webRequest is replaced by declarativeNetRequest, but they don't provide one single example of how to do this.
Manifest v3 looks like is broken and google developers don't care anymore:
https://bugs.chromium.org/p/chromium/issues/detail?id=1135492.
You need to add in your manifest.json the webRequestAuthProvider permission.
{
"version": "1.0.0",
"manifest_version": 3,
"name": "Chrome Auth Proxy",
"permissions": [
"tabs",
"unlimitedStorage",
"storage",
"webRequest",
"webRequestAuthProvider"
],
"host_permissions": [
"<all_urls>"
],
"background": {
"service_worker": "background.js"
},
"minimum_chrome_version": "22.0.0"
}
I have developed a extension primarily focused on chrome which works but now i need that extension to work in firefox either so I checked by loading the extension by going to about:debugging page and loading temporary addons. Currently, I go an error. I got error something like this
Reading manifest: Error processing options_page: An unexpected
property was found in the WebExtension manifest.
Reading manifest: Error processing oauth2: An unexpected property
was found in the WebExtension manifest.
Reading manifest: Error processing key: An unexpected property was
found in the WebExtension manifest.
Here is what my manifest file looks like(I removed options_page)
manifest.json
{
"version": "1.0",
"name": "Browser Extension",
"manifest_version": 2,
"description":
"This extension allow the user to select the text and redirect to the application",
"page_action": {
"default_title": "Select Text",
"default_popup": "index.html"
},
"icons": {
"16": "img/browser16.png",
"48": "img/browser48.png",
"128": "img/browser128.png"
},
"background": {
"scripts": ["extension/js/background.js"],
"persistent": true
},
"content_scripts": [
{
"matches": [
"https://mail.google.com/mail/*/*",
"http://mail.google.com/mail/*/*"
],
"js": ["extension/js/jquery.min.js", "extension/js/content.js"],
"css": ["extension/css/main.css"],
"run_at": "document_end"
}
],
"permissions": [
"contextMenus",
"tabs",
"storage",
"webNavigation",
"notifications",
"cookies",
"identity",
"*://mail.google.com/mail/*/*",
"https://www.googleapis.com/*",
"https://*.googleusercontent.com/*"
],
"web_accessible_resources": ["img/browser128.png", "img/ios-link.svg"],
"oauth2": {
"client_id":
"114446495690-8ejpdgvmn8vc9pblteupetas.apps.googleusercontent.com",
"scopes": ["profile", "https://www.googleapis.com/auth/gmail.readonly"]
},
"key":
"MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEAnqFjzbt+LtejD1JhOyMUbejOHdLoemzryr+ZQHK2CEKuI0yVVYToFs7eNusH/hfxhnyF27G4BU8apsTc695EpVQGD0ANKdt6BjubRnA/4VcdkmfdD3D9nsdCc+fHkINRU5e05grfs/BETWW/JAUULduaNWGfhT7"
}
How do i resolve above issues to make it firefox compatible as well?
I'm creating a chrome extension but I'm having some difficulties in use notifications webkit. When I try to display a notification, an exception is thrown:
Uncaught Error: SecurityError: DOM Exception 18
Bellow follow my Javascript code:
var icon = 'icon_48.png';
var title = 'Test Plugin';
var body = message;
var popup = window.webkitNotifications.createNotification(icon, title, body);
popup.show();
Bellow follow my manifest.json:
{
"name": "Test Plugin",
"version": "1.0.6",
"manifest_version": 2,
"description": "This is a test",
"browser_action": {
"default_icon": "images/icon_32.png",
"default_popup": "popup.html"
},
"icons": {
"128": "images/icon_128.png",
"16": "images/icon_32.png",
"48": "images/icon_48.png"
},
"permissions": [
"http://*/*",
"https://*/*",
"contextMenus",
"tabs",
"notifications",
"management",
"webRequest"
],
"content_scripts": [
{
"matches": ["<all_urls>"],
"js": ["webtoolkit-sha1.js","content.js"],
"run_at": "document_end",
"css" : ["css/style.css"]
}
],
"web_accessible_resources": ["webtoolkit-sha1.js","inject.js","icon_48.png"]
}
What am I doing wrong?
Thanks everybody!
Information Update:
manifest.json has the attribute notifications in permissions section but when I print the webkitNotifications.checkPermission() the result was 1 (PERMISSION_NOT_ALLOWED).
The notifications permission only applies to the extension's process. In order to get your code to work, a background (or event) page needs to be added, which creates the notification. The content script can use the messaging API to request the notification.
XMLHttpRequest cannot load http://localhost:4567/save. Origin chrome-extension://cbemaelkkmebiohhjgmlclegalijdbbh is not allowed by Access-Control-Allow-Origin.
Even thought I'm getting this error the extension seems to be calling the URL. The message passing from contentscript.js to background.html took me a few minutes to wire up, but seems ok. I'm confused.
Here is my manifest.
{
"name": "FirstExt",
"version": "1.0",
"description": "My First Extension",
"browser_action": {
"default_icon": "icon.png",
"popup": "popup.html"
},
"content_scripts": [
{
"matches": ["http://*"],
"js": ["jquery.min.js", "contentscript.js"]
}
],
"background_page": "background.html",
"permissions": [ "http://*",
"http://localhost:4567/*" ]
}
Try changing http://* to http://*/ (and removing the localhost entry).
If you're trying to access a https page, you will need that too.
Replace "http://*" with "<all_urls>".