I'm working on an extension for Chrome that uses an RSS parser, however I have used several different methods and I keep getting the error: "XMLHttpRequest cannot load Example.rss. Origin chrome extension://djhppbppokfmldecpcfbcmchagimpmpc is not allowed by Access-Control-Allow-Origin."
Tried using the AJAX feed and jFeed methods in the first answer below but neither worked for me.
How to parse an RSS feed using JavaScript?
Here's my JavaScript function:
jQuery.getFeed({
url: 'http://example.rss',
success: function(feed) {
alert(feed.title);
}});
My Manifest.JSON looks like
"manifest_version": 2,
"version": "1.0",
"permissions": ["http://*/", "tabs"],
Any help would be greatly appreciated.
You need to add CSP in your manifest.
Something like this line, but change example.com to your feed:
content_security_policy": "script-src 'self' https://example.com; object-src 'self'
For more read this: CSP in Chrome extensions
Your specified host permission is missing a path.
Change http://*/ to http://*/*
For more info, see the chrome documentation on match patterns.
Related
I'm developing a Chrome extension in MV3. I need to integrate Stripe with this extension. This extension overrides the new tab. And I'm using ReactJs and Webpack.
NPM Package using: React Stripe.js
Right now I'm getting
stripe.esm.js:30 Refused to load the script 'https://js.stripe.com/v3' because it violates the following Content Security Policy directive: "script-src 'self'". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.
I've tried adding
"content_security_policy": {
"extension_pages": "script-src 'self' https://js.stripe.com/v3; object-src 'self'; frame-src https://js.stripe.com/v3"
}
in manifest.json but I get this.
What am I doing wrong? Is it not possible to use it like this in MV3?
Your help is appreciated.
Basically the simple and straight forward answer is that you cannot do your implementation this way. First “Remotely hosted code is no longer allowed; an extension can only execute JavaScript that is included within its package.” as per the chrome developer documentation [0].
Stripe has also addressed this issue in their GitHub which you can read more about here [1].
As for the best way to handle this situation is for your extension to generate a link to an external website that you would create. In there, you’d be able to create a CheckoutSession or even integrate with PaymentElements.
I hope this shed some light on how to move forward.
[0] https://developer.chrome.com/docs/extensions/mv3/intro/mv3-migration/#feature-summary
[1] https://github.com/stripe/stripe-js/issues/273
I try to connect youtube API to use it in "browser_action" popup. There is a quickstart guide in youtube API page. There is a HTML code which can be copy-paste to try if it work and use it later.
Problem happens with it comes to using external .js file(youtube API) It gives me error:
Refused to load the script 'https://apis.google.com/js/api.js' because it
violates the following Content Security Policy directive: "script-src 'self'
blob: filesystem: chrome-extension-resource:".
and its okay, here we can learn why it works like that. Later in this article it says best way it to include the files into the project. In this case its rather hard, becouse the api.js has more links inside, and this one file doesnt do the job.
Later on in the article its written we can add some origins to whitelist, so it would be able to load it form external source. I thing this should solve the problem, so I've added it to the manifest.
"content_security_policy": "script-src 'self' https://apis.google.com/js/api.js; object-src 'self'",
( tried also other versions like "https://apis.google.com/*" etc., but it doesn't make any difference, still getting same error.
What's the problem there? Whitelisting apis.google.com would do the job or it's bad approach? And how to do this properly.
I add full manifest, maybe there is an error
{
"manifest_version": 2,
"name": "YT Gniewos tryhards",
"description": "This extension was made to learn and to try some things with youtube.",
"version": "1.0",
"content_security_policy": "script-src 'self' https://apis.google.com/*; object-src 'self'",
"browser_action": {
"default_icon": "icon.png",
"default_popup": "qucikstart.html",
"default_title": "Click here!"
},
"permissions": [
"activeTab",
"storage"
]
}
Create OAuth 2.0 credentials for Chrome.
You need to specify the Application ID for your Chrome app or extension. Use the Google Chrome Identity API to obtain that ID.
I am working on a chrome extension that makes use of the Google places API. I am not able to load the API due to Content Security Policy(https://developer.chrome.com/extensions/contentSecurityPolicy). I tried using permissions, get request, adding the script to body on document ready (what I found on research), nothing works. I get this error all the time:
Refused to load the script 'https://maps.googleapis.com/maps/api/js?key=MY_KEY8&sensor=true&callback=initialize' because it violates the following Content Security Policy directive: "script-src 'self' 'unsafe-eval' https://apis.google.com".
Is it so that one cannot make a chrome extension using a Google API or may be any other external API? Can someone suggest some way to do so.
{
"manifest_version": 2,
"version": "1.0",
"permissions": [
"identity",
"https://*.google.com/",
"geolocation",
"maps.googleapis.com/maps/api/…; ],
"content_security_policy": "script-src 'self' 'unsafe-eval' maps.googleapis.com object-src 'self'"
}
I'm trying to send a request from chrome packaged app:
$.ajax({
url: "https://accounts.google.com/o/oauth2/auth?client_id=xxxapps.googleusercontent.com&response_type=id_token&scope=openid%20email", //"https://www.googleapis.com/plus/v1/people/me",
jsonp: "responseText",
dataType: "jsonp",
data: {
q: "select *",
format: "json"
},
success: function( response ) {
console.log( response );
}
});
and recieving the following error:
Refused to load the script
'https://accounts.google.com/o/oauth2/auth?client_id=xxx&q=select+*&format=json&_=xxx'
because it violates the following Content Security Policy directive:
"default-src 'self' chrome-extension-resource:". Note that
'script-src' was not explicitly set, so 'default-src' is used as a fallback.
The manifest file of the app contains following:
"content_security_policy": "script-src 'self' https://accounts.google.com; object-src 'self'"
How to fix this error?
The error messages you're seeing are the answer. The first one was saying you were violating CSP. The second is saying you can't change CSP in a Chrome App.
Read more about Content Security Policy in a Chrome App, and for completeness another discussion in the context of Chrome Extensions. You have the answer to the question you asked, but you might want to ask a new question explaining what you're trying to do (as opposed to why you're seeing these error messages). If your overall goal is to run external (i.e., downloaded) content in a Chrome App, the only way to do it according to the Chrome Web Store's developer terms of service is to sandbox the code and message to/from your normal, privileged code.
I think I've solved it by adding to manifest:
"permissions": ["https://accounts.google.com/"]
I've been seeing this error while I try to load my chrome extension:
Refused to execute inline script because it violates the following Content Security Policy directive: "script-src 'self' https://ajax.googleapis.com".
Here is part of my manifest.json:
...
"background": {
"scripts": ["launcher.js"]
},
"options_page": "options.html",
"content_security_policy": "script-src 'self' https://ajax.googleapis.com; object-src 'self'",
"permissions": [
"tabs", "notifications", "http://*/*", "https://*/*"
...
In whole of my javascript I've only been communicating with https://ajax.googleapis.com and I've ensured with the Network tab of Inspect views.
And I've verified all my javascript code sits inside my .js file only. (And yes I'm using addEventListener() wherever necessary.
Any suggestions?
UPDATE: Showing code responsible for the error (asked by Rob)
This is the only place where I'm communicating with ANY server:
....
$.ajax({
type: "get",
url: "https://ajax.googleapis.com/ajax/services/feed/load?v=1.0&num=" + storyCount + "&callback=?",
data: {
q: link,
output: "json_xml"
},
async: false,
dataType: "json",
success: function (data) {
if (data.responseStatus == 200) {
//process JSON
}
....
With the Change from Manifest Version 1 to 2 . Chrome Extension do not allow you to use inline javascript. You need to place all your javascript inside a .JS file and include it inside the html page.
Also remove all onclick, onchange,onsubmit to eventlistner events.
Thanks
This error message has nothing to do with the requests you do to other servers - it is about inline scripts. If you don't have any inline scripts then most likely it comes up because somewhere you are creating code dynamically, by means of eval(), new Function() or similar. For example, jQuery will do that to parse JSON if it doesn't find JSON.parse() method (in Chrome this method should normally be available however). From the info you gave here it is impossible to tell which code is responsible for the error.
Regardless of that, you should definitely not use JSONP as Rob W correctly noted in the comments. JSONP will execute code from a remote server in the context of your extension which is inherently insecure - theoretically it would only call the callback but practically it could also do something malicious. You should use JSON instead (data being downloaded and parsed, no remote code execution) and remove ajax.googleapis.com from your Content Security Policy.