Script causes “Refused to execute inline script: Either the 'unsafe-inline' keyword, a hash… or a nonce is required to enable inline execution”

Question

I keep getting this error:

Refused to execute inline script because it violates the following Content Security Policy directive: "default-src 'self' data: gap: http://www.visitsingapore.com https://ssl.gstatic.com 'unsafe-eval'". Either the 'unsafe-inline' keyword, a hash ('sha256-V+/U3qbjHKP0SaNQhMwYNm62gfWX4QHwPJ7We1PXokI='), or a nonce ('nonce-...') is required to enable inline execution. Note also that 'script-src' was not explicitly set, so 'default-src' is used as a fallback.

Can anyone tell me how to solve this and what does it mean? My code is:

<meta http-equiv="Content-Security-Policy" content="default-src 'self' data:gap: http://www.visitsingapore.com   https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *">
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" type="text/css" href="css/index.css">
<link rel="stylesheet" href="css/jquery.mobile-1.4.5.css">
<script src="lib/jquery-3.2.1.min.js"></script>

<script type="text/javascript" src="scripts/key.js"></script>
<script>$.ajax({
        url: ' http://www.visitsingapore.com/api.listing.en.json',
        type: 'GET',
        beforeSend: function (xhr) {
            xhr.setRequestHeader('email ID', '[email protected]');
            xhr.setRequestHeader('token ID', '-------');
        },
        data: {},
        success: function (qwe12) {
            var TrueResult2 = JSON.stringify(qwe12);
            document.write(TrueResult2);
        },
        error: function () { },
    });</script>

Is this a browser specific error? or: is this a webkit specific security 'feature' ? — kent
– kent, Commented Mar 2, 2021 at 10:21

sideshowbarker · Accepted Answer · 2022-04-27 06:13:24Z

46

The best way to fix this would be to take that $.ajax(…) call out of the document and move it into an external file called ajax-call.js, and then do the following:

<script src="ajax-call.js"></script>

The reason that’s better is, if you’re already going to the effort of setting a CSP policy for your document, then you should ideally go to the additional effort of removing all inline scripts.

But if for some reason you really need to keep the script inline in the document, you can change that meta element so the exact sha256 hash value from the error message is included as a source for the script-src directive, like this (with some line breaks added just for readability):

<meta http-equiv="Content-Security-Policy"
  content="default-src 'self' data:gap: http://www.visitsingapore.com 
  https://ssl.gstatic.com 'unsafe-eval';
  style-src 'self' 'unsafe-inline';
  media-src *;
  script-src 'sha256-V+/U3qbjHKP0SaNQhMwYNm62gfWX4QHwPJ7We1PXokI='
">

And the following are a couple places to get a bit more information:

edited Apr 27, 2022 at 6:13

answered Sep 17, 2017 at 1:23

sideshowbarker

89.2k30 gold badges219 silver badges216 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Yi Kiat Over a year ago

I tried to make an effort to create a new js file and put the tag in the html file <script type="text/javascript" src="scripts/ajax-call.js"></script> but i have got another error "XMLHttpRequest cannot load visitsingapore.com/api.listing.en.json. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'localhost:4400' is therefore not allowed access." what does this means?

sideshowbarker Over a year ago

It means the problem described in the question is solved. But you have an additional completely infrared problem than the one you describe in the question and that's answered here. So you should post a new question about the additional unrelated problem

Rajasekar Over a year ago

@sideshowbarker Adding the sha256 hash value from the error worked for me, thank you

Ogglas · Accepted Answer · 2024-12-04 14:11:21Z

It happens because of your CSP that does not allow inline scripts. You can read more about how it works and how to allow it here:

https://content-security-policy.com/examples/allow-inline-script/

I got a similar error after enabling client-side monitoring for Azure App Service with Application Insights.

Refused to execute inline script because it violates the following Content Security Policy directive: "default-src 'self'". Either the 'unsafe-inline' keyword, a hash ('sha256-...'), or a nonce ('nonce-...') is required to enable inline execution. Note also that 'script-src' was not explicitly set, so 'default-src' is used as a fallback.

Got it working again by disabling client-side monitoring by setting APPINSIGHTS_JAVASCRIPT_ENABLED to false.

https://learn.microsoft.com/en-us/azure/azure-monitor/app/codeless-app-service?tabs=net#enable-client-side-monitoring

Oceanmnc · Accepted Answer · 2023-07-25 09:24:17Z

-1

In my case this is happen due to plugin,Plugin trying to execute some operation in website and website blocking it. Issue is with BlazeMeter chrome plugin.

So just remove plugins and then try again. Or Check with another browser.

edited Jul 25, 2023 at 9:24

answered Jul 25, 2023 at 9:23

Oceanmnc

73 bronze badges

1 Comment

Ram Chander Over a year ago

This does not really answer the question. If you have a different question, you can ask it by clicking Ask Question. To get notified when this question gets new answers, you can follow this question. Once you have enough reputation, you can also add a bounty to draw more attention to this question. - From Review

Collectives™ on Stack Overflow

Script causes “Refused to execute inline script: Either the 'unsafe-inline' keyword, a hash… or a nonce is required to enable inline execution”

3 Answers 3

3 Comments

Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

3 Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related