Report this

What is the reason for this report?

Erro ao exibir "Olá mundo", por três vezes, na tela de Console

Posted on January 28, 2025

Eu gostaria de saber, por gentileza, por que ao tentar visualizar a mensagem “Olá mundo” por três vezes na tela de “Console”, aparece essa mensagem de erro, mostrada abaixo?

676718f2f590508f5fe195f8:92 Refused to execute inline script because it violates the following 
Content Security Policy directive: "script-src 'self' 'nonce-McpKUlOdOl0exLPn6JN3HQ==' 
https://code.jquery.com https://cdn.jsdelivr.net". Either the 'unsafe-inline' keyword,
 a hash ('sha256-A70QUc2Kse21wsA4D7Pq5ITbT/jYO221ulMbeKG0p3A='), or a nonce ('nonce-...') is required to enable inline execution.


This textbox defaults to using Markdown to format your answer.

You can type !ref in this text area to quickly search our full set of tutorials, documentation & marketplace offerings and insert the link!

These answers are provided by our Community. If you find them useful, show some love by clicking the heart. If you run into issues leave a comment, or add your own answer to help others.

Hi there!

This error occurs because your website has a Content Security Policy in place, which restricts the execution of inline scripts for security reasons. Inline JavaScript is blocked unless you explicitly allow it via a CSP directive.

To fix this issue you could try:

  1. Instead of writing the script directly in the HTML file, move your JavaScript to an external .js file and reference it using a <script src="your-script.js"></script> tag. This is the best practice for security and maintainability.

    Example:

    <!-- In your HTML file -->
    <script src="hello-world.js"></script>
    
    // hello-world.js
    console.log("Hello World");
    console.log("Hello World");
    console.log("Hello World");
    
  2. Update your CSP to allow inline scripts by adding a nonce or hash for the script. For example:

    <script nonce="your-nonce-value">
        console.log("Hello World");
        console.log("Hello World");
        console.log("Hello World");
    </script>
    

    Replace your-nonce-value with the nonce value set in your server’s CSP header.

  3. Only if necessary:

    • Locate your server configuration or meta tag defining the CSP.
    • Update the script-src directive to include 'unsafe-inline' or add the appropriate nonce or hash. However, enabling 'unsafe-inline' weakens your security and is not recommended.

For long-term security, option #1 is the most robust. Let me know if you need help implementing it! 😊

- Bobby

Heya,

The error message you’re seeing is related to Content Security Policy (CSP) restrictions that are blocking the execution of inline scripts in your web page.

Why is this happening?

  1. CSP is preventing inline scripts – Your CSP directive specifies allowed sources for JavaScript using script-src. However, it does not include 'unsafe-inline', which means inline scripts (scripts written directly inside <script> tags rather than loaded from an external file) are not allowed.

  2. The allowed sources are restricted – According to the error message, your CSP allows scripts only from:

    • 'self' (scripts from the same origin)
    • 'nonce-McpKUlOdOl0exLPn6JN3HQ==' (only scripts with this nonce)
    • https://code.jquery.com
    • https://cdn.jsdelivr.net

    If your script does not match any of these sources, it will be blocked.


There are a few ways to resolve this issue, depending on your control over CSP settings:

1. Use an External JavaScript File

  • Instead of writing the script inline, save it in a separate file (e.g., script.js) and reference it:
<script src="script.js"></script>
  • Ensure that script.js is being loaded from an allowed source (like 'self' if it’s on the same domain).

2. Use a Nonce (Preferred for Inline Scripts)

  • If you must use inline scripts, add the appropriate nonce to the <script> tag:
<script nonce="McpKUlOdOl0exLPn6JN3HQ==">
  console.log("Olá mundo");
  console.log("Olá mundo");
  console.log("Olá mundo");
</script>
  • The nonce value must match what is set in the CSP header.

3. Modify CSP to Allow Inline Scripts (Less Secure)

  • If you control the CSP policy, you could add 'unsafe-inline' to script-src, but this is generally not recommended for security reasons:
<meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline' https://code.jquery.com https://cdn.jsdelivr.net;">

Heya, @b7a48936ce14461794a3a55f6cf518

Instead of writing JavaScript inside your HTML, save it in a separate file.

  1. Create a file called script.js and add:
console.log("Olá mundo"); console.log("Olá mundo"); console.log("Olá mundo");
  1. In your HTML file, include it like this:
<script src="script.js"></script>
  • This avoids CSP restrictions because external scripts are allowed by default.
  • It’s the safest and most maintainable way to handle JavaScript.

Regards

The developer cloud

Scale up as you grow — whether you're running one virtual machine or ten thousand.

Get started for free

Sign up and get $200 in credit for your first 60 days with DigitalOcean.*

*This promotional offer applies to new accounts only.