Local jquery.js file causing Content Security Policy (CSP) violation errors - javascript

I have the following js file locally;
<script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>
Running my Cordova Phonegap app in Ripple throws the following error;
jquery.mobile-1.4.5.min.js:3 Refused to load the image 'data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==' because it violates the following Content Security Policy directive: "default-src * 'unsafe-eval' 'unsafe-inline'". Note that 'img-src' was not explicitly set, so 'default-src' is used as a fallback.
I have the following metadata in the html though;
<meta http-equiv="Content-Security-Policy" content="default-src * 'unsafe-eval' 'unsafe-inline'">
How can I prevent (CSP) violation errors from being thrown? Any fix?
Edit : Adding the ajax.googleapis url into meta helped to remove most of the CSP errors ;
<meta http-equiv="Content-Security-Policy" content="default-src * 'unsafe-eval' https://ajax.googleapis.com/ 'unsafe-inline'">
But I do still have some like the following;
Refused to load the font 'data:font/woff;base64,d09GRgABAAAAAI3gABIAAAABRWQAAQABAAAAAAAAAAAAAAAAAAAAA…IwnaGGIYHBlUELLMKwH6htK8MUhmKGIAYjqCImVEUgs1mBOtm1gRYpuNZmSrgAALqcEVgAAAA=' because it violates the following Content Security Policy directive: "default-src * 'unsafe-eval' https://ajax.googleapis.com/ 'unsafe-inline'". Note that 'font-src' was not explicitly set, so 'default-src' is used as a fallback.
The source of the error is : http://localhost:3000/#&ui-state=dialog
But I believe it is not a big deal since I presume that it is Ripple Emulator causing that error.

Add to content security directives: img-src 'self' data:;
<meta http-equiv="Content-Security-Policy" content="default-src * 'unsafe-eval' 'unsafe-inline'; img-src 'self' data:">
This is according to the grammar in CSP spec
link to answer and more info

Related

HTTP Content-Security-Policy header not working correctly for script-src in Struts

I have a problem updating my version of struts struts2-core-2.5.30 project to struts2-core-6.1.1 so I began to receive an error indicating that the security policies have been violated, doing some research, I found that a header should be added
[Report Only] Refused to load the script '<URL>' because it violates the following Content Security Policy directive: "script-src 'nonce-MOz6w31eaDHGUDfV__K8LEZ1' 'strict-dynamic' http: https:". Note that 'strict-dynamic' is present, so host-based allowlisting is disabled. Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.
and inside this error i have this description
[Report Only] Refused to load the script 'http://localhost:8080/Portal/html/js/jquery/jquery-1.8.3.min.js' because it violates the following Content Security Policy directive: "script-src 'nonce-MOz6w31eaDHGUDfV__K8LEZ1' 'strict-dynamic' http: https:". Note that 'strict-dynamic' is present, so host-based allowlisting is disabled. Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.
[Report Only] Refused to load the script 'http://localhost:8080/Portal/html/js/jquery/jquery-ui.1.10.4.min.js' because it violates the following Content Security Policy directive: "script-src 'nonce-MOz6w31eaDHGUDfV__K8LEZ1' 'strict-dynamic' http: https:". Note that 'strict-dynamic' is present, so host-based allowlisting is disabled. Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.
however I have tried these headers
<meta http-equiv="Content-Security-Policy" content="default-src 'self'">
<meta http-equiv="Content-Security-Policy" content="default-src *;
style-src * 'unsafe-inline'; script-src * 'unsafe-inline'
'unsafe-eval'; img-src * data: 'unsafe-inline'; connect-src *
'unsafe-inline'; frame-src *;">
<meta http-equiv="Content-Security-Policy" content="default-src 'nonce-rAnd0m'">
<script src="${pageContext.request.contextPath}/html/js/jquery/jquery-1.8.3.min.js" type="text/javascript" nonce="rAnd0m123"></script>
with each of them I get the same error, In my previous version of struts it did not ask me for any of this
have also tried to make an interceptor to add the corresponding directives, however it has not worked for me either.
import com.opensymphony.xwork2.ActionContext;
import com.opensymphony.xwork2.ActionInvocation;
import com.opensymphony.xwork2.interceptor.AbstractInterceptor;
import javax.servlet.http.HttpServletResponse;
import org.apache.struts2.StrutsStatics;
public class SessionInterceptor extends AbstractInterceptor{
private static final long serialVersionUID = 1L;
public String intercept(ActionInvocation invocation) throws Exception {
ActionContext ac = invocation.getInvocationContext();
HttpServletResponse response = (HttpServletResponse) ac.get(StrutsStatics.HTTP_RESPONSE);
//HttpServletResponse response = ServletActionContext.getResponse();
response.addHeader("X-Frame-Options", "SAMEORIGIN");
response.addHeader("Content-Security-Policy-Report-Only", "default-src 'self'; script-src 'self' 'unsafe-inline'; object-src 'none'; style-src 'self' 'unsafe-inline'; img-src 'self'; media-src 'none'; frame-src 'none'; font-src 'self'; connect-src 'self'; report-uri REDACTED");
response.addHeader("X-Content-Security-Policy-Report-Only", "default-src 'self'; script-src 'self' 'unsafe-inline'; object-src 'none'; style-src 'self' 'unsafe-inline'; img-src 'self'; media-src 'none'; frame-src 'none'; font-src 'self'; connect-src 'self'; report-uri REDACTED");
return invocation.invoke();
}
}
In the same way I have updated the jquery-1.8.3 version as suggested in the comments but it has not worked for me either
I was also struggling with the new Content Security Policy interceptor. We had to temporarily disable it since Struts doesn't really provide any way to configure it yet and all of those browser console error / CSP reports are really unacceptable.
At least for me, in order to disable it across all of my actions in struts.xml I needed to reference "cspInterceptor" instead of "csp" as follows:
<interceptor-ref name="defaultStack" >
<param name="cspInterceptor.disabled">true</param>
</interceptor-ref>
Struts provides support for Content-Security-Policy since version 6.x.
The functionality is implemented primarily in CspInterceptor.
This interceptor is configured by providing a convenient default implementation of CspSettings.
This interceptor is included by default in the Struts configuration. As you can see in the linked resource and in the documentation by default is configured in report only, non enforcing mode:
<interceptor-ref name="csp">
<param name="disabled">false</param>
<param name="enforcingMode">false</param>
</interceptor-ref>
I reviewed the current source code of the library and the companion documentation and it seems that providing a custom CSP configuration to CspInterceptor is not possible right now.
That means that in order to mitigate your error one possibility will be to disable the CspInterceptor and provide your own. The Struts documentation provides guidance about how it could be accomplished. In your case, I think it should look like similar to the following:
<action name="myAction" class="myActionClass">
<interceptor-ref name="defaultStack">
<param name="csp.disabled">true</param>
</interceptor-ref>
</action>
In addition, in the commit I cited at the beginning of the answer they mention the components and corresponding tags s:link and s:script as a possible way for fetching the required CSS and Javascript resources taking into account the default CSP settings: basically they provide the necessary mechanisms for taking into account the appropriate nonces for the linked resources, required according to the policy applied. Please, consider review for instance this page in the showcase provided by Struts as example, reproduced here for convenience:
<%#taglib prefix="s" uri="/struts-tags" %>
<html lang="en">
<head>
<!-- content removed for brevity -->
<s:url var="jqueryJs" value='/js/jquery-2.1.4.min.js' encode='false' includeParams='none'/>
<s:script src="%{jqueryJs}"/>
<!-- other resources... now handling inline sources -->
<s:script type="text/javascript">
$(function () {
var alerts = $('ul.alert').wrap('<div />');
alerts.prepend('<a class="close" data-dismiss="alert" href="#">×</a>');
alerts.alert();
});
</s:script>
<!-- ... -->
</head>
The content of your policies and the one in the error message don't match, and while you are adding "Content-Security-Policy", the error message is for "Content-Security-Policy-Report-Only". This means that there is another header present, and you are adding another. Adding another can only make the policy stricter. The report only version of Content-Security-Policy doesn't actually block anything, and must be set as a response header. You should identify where this header is set and modify it as needed.
Additionally you should replace jquery-1.8.3 with a recent version that doesn't have known vulnerabilities.

'unsafe-eval' is not an allowed source of script

Error: Uncaught EvalError: Refused to evaluate a string as JavaScript because 'unsafe-eval' is not an allowed source of script in the following Content Security Policy directive: "script-src 'self'".
The error only shows in other browser and not chrome. I found some answers and they say to add
<meta http-equiv="Content-Security-Policy" content="font-src 'self' 'unsafe-inline' data:; img-src 'self' data:; style-src 'self' 'unsafe-inline' data:; script-src 'unsafe-eval' 'unsafe-inline' data:; default-src 'self' localhost:*">
Reference: Content Security Policy
And after adding the meta tag an error pops up on refresh of the browser including chrome.
Error: Refused to load the script '' because it violates the following Content Security Policy directive: "script-src 'unsafe-eval' 'unsafe-inline' data:". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.
Please help.
I found the answer.
The problem was with helmet node module.
When I remove the app.use(helmet()) from my backend, The problem goes away.
If you're also having this error, I replaced the app.use(helmet()) with app.use(
helmet({
contentSecurityPolicy: false,
})
);

Stripe Connect : Content Security Policy issue

Even By using meta tags, It is still showing error and Iframe is not working
<meta http-equiv="Content-Security-Policy" content="
default-src *;
style-src 'self' 'unsafe-inline';
script-src * 'self' https://checkout.stripe.com 'unsafe-inline'
connect-src : * 'self' https://checkout.stripe.com 'unsafe-inline'
frame-src : * 'self' https://checkout.stripe.com 'unsafe-inline'
'unsafe-eval'
;" >
Link reference : https://stripe.com/docs/security/guide#content-security-policy
Error : Content Security Policy: The page’s settings blocked the loading of a resource at inline (“script-src”)
Also I used header() to set this up, but that also didn't worked. Any Help will be appreciated
Your CSP has a lot of errors:
You have missed semicolons ; to separate script-src / connect-src / frame-src directives lists.
: is nor required in the connect-src : * ... and in the frame-src : * ...
Remove 'unsafe-inline' and 'unsafe-eval' from the connect-src and frame-src directives, those are not supported there
The * (asterisk) covers any host-sources like https://checkout.stripe.com and wss://checkout.stripe.com
BUT these are not significant, these just leads the CSP you have really is:
default-src *;
style-src 'self' 'unsafe-inline';
script-src * 'self' 'unsafe-inline' 'unsafe-eval'
This CSP restrict nothing except data:-Urls usage. Therefore the error:
Content Security Policy: The page’s settings blocked the loading of a resource at inline (“script-src”)
cannot belong your CSP.
Looks like you already have CSP header published somewhere. Hence second CSP via <meta> or HTTP header does not have effect as expected.
Check what CSP header you really have got in browser, the tutorial is here.
Check web-server config in Nginx for add_header Content-Security-Policy ... or .htaccess file (if Apache) for Header set Content-Security-Policy ... presence.
Or maybe you have installed some plugins for managing CSP headers.
You're missing img-src https://*.stripe.com described in the Stripe documentation.
Also the asterisk character alone doesn't work as "any resource" (example of incorrect use in your code: default-src *). You need to use it as part of the <host-source> (e.g. *.example.com). See MDN docs for more details.

How to enable CSP(Content Security Policy) in Jquery 3.4.1 & Jquery-ui 1.12.1?

I'm currently using jQuery 3.4.1 and jQuery-UI 1.12.1 (for autocomplete) on my website. I'm also using unsafe-inline and unsafe-eval which I don't want to use.
My <meta/> tag:
<meta
http-equiv="Content-Security-Policy"
content="script-src 'self' 'unsafe-eval' https: cdnjs.cloudflare.com code.highcharts.com stackpath.bootstrapcdn.com cdn.jsdelivr.net code.jquery.com 'unsafe-inline'; connect-src 'self' news.google.com; worker-src 'self'; manifest-src 'self';"
>
Expanded, that content is:
script-src
'self'
'unsafe-eval'
https:
cdnjs.cloudflare.com
code.highcharts.com
stackpath.bootstrapcdn.com
cdn.jsdelivr.net
code.jquery.com
'unsafe-inline';
connect-src
'self'
news.google.com;
worker-src
'self';
manifest-src
'self';
Whenever the AJAX call happens in jQuery-UI autocomplete, it throws an error saying it violates CSP policy.
What do I need to do to properly enable CSP on my website with jQuery? I don't want to use unsafe-eval and unsafe-inline on my website.
Console Error:
Whenever the AJAX call happens in jQuery-UI autocomplete, it throws an
error saying it violates CSP policy.
Show me the text of this CSP error and I'll say you what to do (Chrome console is prefer).
As can be seen from CSS for jQuery-UI 1.12.1 you need to have img-src data: in your policy.
As can be seen from the script 1.12.1/jquery-ui.js - it does not use unsafe eval calls. Maybe you use those in your scripts. Remove 'unsafe-eval' from the script-src and check errors raised in the console.
If there is not messages like Refused to evaluate a string as JavaScript because unsafe-eval is not an allowed or the page's settings blocked the loading of a resource at eval - you do not need to have 'unsafe-eval' in the script-src.
.
The best practice is to forget about insecure HTTP: and use HTTPS:. There were cases when Internet providers (in the RU-segment of the Internet) interfered with the client's traffic and injects ads into jquery lib. So:
The rule connect-src 'self' news.google.com; should be connect-src 'self' https://news.google.com; since news.google.com always retirects to HTTPS:. All $ajax-request to news.google.com should use the https:// scheme too.
the same is with cdn.jsdelivr.net, it always redirects to HTTPS:
Therefore safe rules should be:
script-src 'self' 'unsafe-eval' https://cdnjs.cloudflare.com https://code.highcharts.com https://stackpath.bootstrapcdn.com https://cdn.jsdelivr.net https://code.jquery.com
and all call the scripts should be done with HTTPS: <script src='https://cdn.jsdelivr.net/npm/jquery#3.2.1/dist/jquery.min.js'...
When you specify just scheme-source https: in the script-src - it leads to zero-protection since any sources will be allowed via https:.
This additionally helps to avoid problems of mixed content blocking.

Javascript CSP Block

I am new to metabase. I have downloaded the metabase source code and hosted it in the Ubuntu 16.04 LTS server.When I am starting the Metabase server with the "lein ring server" command, I get "java.awt.HeadlessException". I have read some where in the github issues only that it can be ignored. Front end is built with "yarn run build-hot" command. When accessing the front end from the browser, I get the following errors
Refused to load the script
'http://locahost:8080/app/dist/vendor.hot.bundle.js?222bfa78ab06d868cbf4'
because it violates the following Content Security Policy directive:
"script-src 'unsafe-inline' 'unsafe-eval' 'self'
https://maps.google.com https://apis.google.com
https://www.google-analytics.com https://*.googleapis.com
*.gstatic.com localhost:8080".
Refused to load the script
'http://locahost:8080/app/dist/app-main.hot.bundle.js?222bfa78ab06d868cbf4'
because it violates the following Content Security Policy directive:
"script-src 'unsafe-inline' 'unsafe-eval' 'self'
https://maps.google.com https://apis.google.com
https://www.google-analytics.com https://*.googleapis.com
*.gstatic.com localhost:8080".
Its seems like CSP issue. U can fix this problem using
<meta http-equiv="Content-Security-Policy" content="default-src 'self'">
<meta http-equiv="Content-Security-Policy" content="default-src 'self' https://www.google.com; script-src 'self' 'unsafe-inline' 'unsafe-eval' https://www.google.com; style-src 'unsafe-inline' 'self' https://www.google.com; connect-src 'self' https://api.gole.in;img-src 'self' https://www.google.co.in/ads/ga-audiences; font-src 'self' data: https://fonts.gstatic.com;">
How to allow eval()?
I'm sure many people would say that you don't, since 'eval is evil' and the most likely cause for the impending end of the world. Those people would be wrong. Sure, you can definitely punch major holes into your site's security with eval, but it has perfectly valid use cases. You just have to be smart about using it. You allow it like so:
content="script-src 'unsafe-eval'"
Reference Link : https://content-security-policy.com/

Categories