Content-Security-Policy blocks Blockonomics pay button

I’m im trying to use blockonomics payment buttons but its getting blocked by Content-Security-Policy.

This is the error - Content Security Policy: The page’s settings blocked the loading of a resource at (“default-src”).

Have tried this "meta http-equiv=“Content-Security-Policy” content=“default-src *; script-src ‘self’ ‘unsafe-inline’ ‘unsafe-eval’; style-src ‘self’ ‘unsafe-inline’”

but its still getting blocked. Any help is appreciated.

1 Like

Hi @sidontoken,

You can’t override the policy in the Content-Security-Policy HTTP header with a less-restrictive policy. You need to instead change the code that’s setting the value of the Content-Security-Policy HTTP header. eg.
Header set Content-Security-Policy "script-src ...;"
Should be changed to
Header set Content-Security-Policy "script-src 'unsafe-inline' 'unsafe-eval'"

Please let me know if this solves your issue, or if you require any further assistance.

Kind regards

Sorry I forgot to mention that it’s an next js and tailwins css app.

This is what i have now. I forgot to put it into a code bracket thats why the </> was not there

 <meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'"/>

could you put your response into a meta tag? Thank you.

1 Like

In NextJS, the Content-Security-Policy is typically set in the next.config.js file: Advanced Features: Security Headers | Next.js

Both and should be added to the headers in the next.config.js file

module.exports = {
  async headers() {
    return [
        // Apply these headers to all routes in your application.
        source: '/:path*',
        headers: [
            key: 'Content-Security-Policy',
            value: "script-src 'self' 'unsafe-inline' 'unsafe-eval'",

Your application may also be using a module similar to next-secure-headers, which helps manage the headers in your app. The next.config.js configuration would look similar to the following in this case:

const { createSecureHeaders } = require("next-secure-headers");

module.exports = {
  async headers() {
    return [{
      soruce: "/(.*)",
      headers: createSecureHeaders({
        contentSecurityPolicy: {
          directives: {
            styleSrc: ["'self'", "", ""],

Please locate how the current policy is being set in your nextjs application, and add the 2 urls to this.