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/"]
Related
sorry for bad description. I have an app that works fine on localhost and test server. On the machine that has connection to test server when I try to access the app via server's IP and port I can access the app too. But with a rerouting that points to my apps test server IP and port I get below 2 errors in a script that I use from a different host. Test server doesn't has outside connection allowed but related script host has been allowed. I have tried adding CSP headers to ISS but it didn't work. How can I resolve this issue or how can I get more details about it. Any help would appreciated. Thank you.
1st error:
Refused to create a worker from
'blob:https://redirecteddomain.com/04891805-36bb-45f7-a4e9-7cb58f25a3bf'
because it violates the following Content Security Policy directive:
"default-src https: data: 'unsafe-inline' 'unsafe-eval'". Note that
'worker-src' was not explicitly set, so 'default-src' is used as a
fallback.
2nd error:
Uncaught DOMException: Failed to construct 'Worker': Access to the
script at
'blob:https://redirecteddomain.com/04891805-36bb-45f7-a4e9-7cb58f25a3bf'
is denied by the document's Content Security Policy.
Script that got the error:
<script src="https://scriptsource.com/script.php?lang=en"></script>
Due to privacy issues domain names are replaced.
Update: So I have tried to download and use the script locally and there were couple of API calls in the javascript file and it gave the same error again.
Update-2: I have checked through the script file and found the lines that are causing the issue, I have added "default-src 'self' 'unsafe-inline'; worker-src blob:;" meta header but still get the same error
const e=window.URL||window.webkitURL,n=new
Blob(['importScripts("'+Dt.faceworker+"?v="+t.replace(/\./g,"")+'");'],
{type:"application/javascript"}),o=e.createObjectURL(n);
Wt=new Worker(o)
The CSP on your page doesn't allow "blob:". Adding another CSP in a meta tag can only impose restrictions, it can't change the other CSP that is likely there and served in a response header. You will likely need to modify the original CSP adding blob: to default-src or worker-src.
I am working on a project in Django, where I am using a javascript from an external payment provider. Upon calling their script, they will insert a payment form embedded in my page.
The documentation on how to integrate with their service is found here. Specifically I am following step 3 and 4.
A snippet of my html is as below. Upon calling my javascript the payment form from checkout.js will be rendered as an iframe in the checkout-container-div element
<div id="checkout-container-div"> </div>
<script src="https://test.checkout.dibspayment.eu/v1/checkout.js?v=1"></script>
In my javascript, I first call my backend to get the paymentId. Then using the obtained paymentId, I am calling the external checkout.js with const checkout = new Dibs.Checkout(checkoutOptions); in order to render the payment form
document.getElementById("paymentButton").addEventListener("click", function() {
//Collect all the fields value and send it to the server
console.log("pay button clicked")
$.ajax({
url : "localDeliveryPayment",
type : "get",
success: function(response) {
if (response['paymentIdCreation'] == true) {
console.log(response);
const checkoutOptions = {
checkoutKey: response['checkoutKey'], // Replace!
paymentId: response['paymentId'],
containerId: "checkout-container-div",
};
const checkout = new Dibs.Checkout(checkoutOptions);
checkout.on('payment-completed', function (response) {
window.location = 'completed.html';
});
}
}
})
})
From Google Chrome's console I get the following error related to test.checkout.dibspayment.eu/:1
Refused to execute inline script because it violates the following Content Security Policy directive: "script-src 'self' 'sha256-NzNw/hrx7wC5UKemwLm4mwVnoDVfHDuSpmZAeKCQaqY=' 'sha256-aKaLBqGLMQ35mP/i/QmpW+s6QnrN3dNb78G9ndv1bC0=' 'sha256-47DEQpj8HBSa+/TImW+5JCeuQeRkm5NMpJWZG3hSuFU='". Either the 'unsafe-inline' keyword, a hash ('sha256-1XgMsIi6szxMi7JX5ZCg4KWReddGOu15C+cKuzlVaf4='), or a nonce ('nonce-...') is required to enable inline execution.
Also I see this error related to checkout.api.ts:126 POST
POST https://test.checkout.dibspayment.eu/api/v1/frontendlogs net::ERR_ABORTED 401 (Unauthorized)
There are some other errors as well that I think is related to content being blocked. I have tried to add the below meta tag to the head in my html base template.
<meta http-equiv="Content-Security-Policy"
content = "script-src 'self'
cdnjs.cloudflare.com
code.jquery.com
cdn.jsdelivr.net
stackpath.bootstrapcdn.com
test.checkout.dibspayment.eu;">
Still I got the error test.checkout.dibspayment.eu/:1
Refused to execute inline script because it violates the following Content Security Policy directive: "script-src 'self' 'sha256-NzNw/hrx7wC5UKemwLm4mwVnoDVfHDuSpmZAeKCQaqY=' 'sha256-aKaLBqGLMQ35mP/i/QmpW+s6QnrN3dNb78G9ndv1bC0=' 'sha256-47DEQpj8HBSa+/TImW+5JCeuQeRkm5NMpJWZG3hSuFU='". Either the 'unsafe-inline' keyword, a hash ('sha256-1XgMsIi6szxMi7JX5ZCg4KWReddGOu15C+cKuzlVaf4='), or a nonce ('nonce-...') is required to enable inline execution.
Also I tried with 'unsafe-inline' keyword in the Content-Security-Policy meta tag, but still got the same error. I have read several places that CSP is blocking for inline code execution and now is really confused if the issue at all is related to inline code execution from the external javascript, or if this error is related to something else?
The solution to this problem on integration of NETS payment service when running in Django turned out not to be fully related to content security protocol. The error I posed originally is related to CSP, but I never managed to solve it. When I used the payment demo webshop I see the same error on my browser as during my own test. The checkout was successful, therefore I figured out that the error is not only related to CSP. It turned out that adding
django_referrer_policy.middleware.ReferrerPolicyMiddleware'
to the middleware in my settings.py and followed by adding
REFERRER_POLICY = 'strict-origin'
in settings.py solved the problem.
I've just updated the Content-Security-Policy settings in the Web.Config file and added the Application Insights JavaScript snippet in my _Layout.cshtml.
Here is what the Content-Security-Policy in the Web.config looks like.
script-src-elem
'self'
'unsafe-inline'
'unsafe-eval'
https://az416426.vo.msecnd.net/scripts/b/ai.2.min.js
*.mymapjs.com
script-src
'self'
'unsafe-inline'
'unsafe-eval'
https://az416426.vo.msecnd.net/scripts/b/ai.2.min.js
*.mymapjs.com
mymapjs.com is not longer working properly, my maps aren't showing up, and my browser is upset with me yelling at me in red letters with the error:
Access to XMLHttpRequest at 'mymapjs.com' from origin 'mywebsite.com' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status.
When I remove the https://az416426.vo.msecnd.net/scripts/b/ai.2.min.js url from the Web.config Content-Security-Policy I get the warning:
Refused to load the script 'https://az416426.vo.msecnd.net/scripts/b/ai.2.min.js' because it violates the following Content Security Policy directive: "script-src-elem 'self' 'unsafe-inline' 'unsafe-eval' https://*.mymapjs.com use.other.net use.other.net/ https://myfont.net/it.js
It turns out I enabled the enableCorsCorrelation = true in the Application Insights configuration.
So then I tried updating the correlationHeaderExcludedDomains values with a wild card value for the mymapjs.com.
correlationHeaderExcludedDomains:
[
'myapp.azurewebsites.net',
'*.queue.core.windows.net',
'*.mymapjs.com'
]
The wild card alone didn't work. I had to strictly type the JS libraries urls AND have the wildcard for it to work properly. It wants the scripts that are directly being requested from the _Layout.cshtml as well as the ones generated from the JS libraries.
correlationHeaderExcludedDomains:
[
'myapp.azurewebsites.net',
'*.queue.core.windows.net',
'*.mymapjs.com'
'https://mymapjs.com-core-events.js'
'https://mymapjs.com-services.js'
'https://mymapjs.com-ui-services.js'
]
If anyone else gets caught up figuring this out, I hope this helps.
I'm trying to retrieve informations from PHP script on localhost
app.js on Cordova application :
var url = 'http://localhost:8000/locations';
$.ajax({
url: url,
type: 'GET',
contentType: "application/json",
async: true,
dataType: 'jsonp',
crossDomain: true,
success: function(resp){
console.log(resp);
},
error: function(err) {}
});
and the php code (with Laravel framwork)
return Location::all()->toJson();
I have this error
Refused to load the script
'http://localhost:8000/locations?callback=jQuery21309354114597663283_1431278135791&_=1431278135792'
because it violates the following Content Security Policy directive:
"default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'".
Note that 'script-src' was not explicitly set, so 'default-src' is
used as a fallback.
You need to add policies to your Cordova app.
http://content-security-policy.com/
http://www.html5rocks.com/en/tutorials/security/content-security-policy/
Second link is exactly what you need, article is well written I can quote only:
https://apis.google.com/js/plusone.js in the context of this page’s
origin. We trust that code, but we can’t expect the browser to figure
out on it’s own that code from apis.google.com is awesome, while code
from apis.evil.example.com probably isn’t. The browser happily
downloads and executes any code a page requests, regardless of source.
Instead of blindly trusting everything that a server delivers, CSP
defines the Content-Security-Policy HTTP header that allows you to
create a whitelist of sources of trusted content, and instructs the
browser to only execute or render resources from those sources. Even
if an attacker can find a hole through which to inject script, the
script won’t match the whitelist, and therefore won’t be executed.
I just added this in the head tag
<access origin="*" />
and it works !
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.