bejamas / gatsby-plugin-csp Goto Github PK

View Code? Open in Web Editor NEW

38.0 38.0 15.0 678 KB

A Gatsby plugin which adds strict Content Security Policy to your project.

License: MIT License

JavaScript 100.00%

content-security-policy csp gatsby-plugin gatsby-plugin-csp

gatsby-plugin-csp's People

Stargazers

Watchers

Forkers

jbleijenbergh skylarweaver nephlin7 richardjkendall lightningspirit dev-b01 wyantb bartlibert aubreyhewes vinassefranche cdennington reacteev primajin donaldboulton

gatsby-plugin-csp's Issues

style-src without sha256 hashes. Styled components issue?

Hi, thanks for the nice plugin. I'm working on a Gatsby Theme with Styled componets and I don't get the hashes in the style-src. Is this a known issue?

Incorrect hashes being generated for styles and src?

Love this plugin, went from "what is CSP" to it's working in like 2 hours.

However I only got it working with the insecure directives:

directives: {
  'script-src': `'self' 'unsafe-inline' 'unsafe-eval' blob:`,
  'style-src': `'self' 'unsafe-inline',
  ...
}

I would like to get it working with the script and style hashes, but it seems that the generated hashes are not correct? When I have these options:

{
    resolve: `gatsby-plugin-csp`,
    options: {
        disableOnDev: false,
        reportOnly: false, // Changes header to Content-Security-Policy-Report-Only for csp testing purposes
        mergeScriptHashes: true, // you can disable scripts sha256 hashes
        mergeStyleHashes: true, // you can disable styles sha256 hashes
        mergeDefaultDirectives: false,
        directives: {
            'script-src': `'self' blob:`,
            'style-src': `'self' blob:`,
            'object-src': `'self' blob:`,
            'img-src': `'self' ...  blob:`,
            'connect-src': `'self' ... *.googleapis.com blob:`,
            'font-src': `'self' ... blob:`,
        },
    }
}

I see an error that implies incorrect hashing:

Refused to execute inline script because it violates the following Content Security Policy directive: "script-src 'self' blob: 'sha256-VQmEp0Z3hhXpgyR8eLC7h/m/fuPoIu20hDeWkLfFJt8='". Either the 'unsafe-inline' keyword, a hash ('sha256-rstJb4fHq3envUwqc55dL7f2YwhXthb/y9glQxrlm+Y='), or a nonce ('nonce-...') is required to enable inline execution.

similar message for styles

Any ideas what I may be doing incorrect? Doesn't work in development nor production.

Issues with gatsby-image

I'm having issues with gatsby-image that generates inline styles.

gatsbyjs/gatsby#10890 (comment)

upgrade-insecure-requests & block-all-mixed-content not working.

Header "upgrade-insecure-requests" & "block-all-mixed-content" are not working.
Why are we not just using a package like "content-security-policy-builder" to build the csp header.
This would fix a lot of features of the header not working.

License?

Hey there! Your plugin looks useful. Wondering what the license is?

I see MIT in the package.json, but there's no license file in the repo.

Refused to execute inline script because it violates the following Content Security Policy directive: "script-src 'self'

This is my gatsby plugin config:

    {
      resolve: `gatsby-plugin-csp`,
      options: {
        disableOnDev: true,
        reportOnly: false, // Changes header to Content-Security-Policy-Report-Only for csp testing purposes
        mergeStyleHashes: false, // you can disable styles sha256 hashes
        mergeScriptHashes: true, // you can disable scripts sha256 hashes
        mergeDefaultDirectives: true,
        directives: {
          'default-src': "'self'",
          'style-src': "'self' https://fonts.googleapis.com https://optimize.google.com 'unsafe-inline'",
          'script-src': `'self' https://static.cdn.prismic.io/prismic.js https://widget.surveymonkey.com https://static.ads-twitter.com https://www.youtube.com  https://assets.customer.io https://cdn.segment.io https://connect.facebook.net https://googleads.g.doubleclick.net https://maps.googleapis.com https://posthog.datascience.hmb.sh https://snap.licdn.com https://static.cdn.prismic.io https://edge.fullstory.com https://prismic.io https://vercel.live https://www.google-analytics.com https://vercel.live/ https://www.googleadservices.com https://www.redditstatic.com https://www.googletagmanager.com https://hmbradley.featurebase.app https://assets.vercel.com https://www.googleoptimize.com`,
          'object-src': "'none'",
          'base-uri': "'self'",
          'connect-src': `'self' https://*.hmbradley.com ...`,
          'font-src': "'self' data: https://fonts.gstatic.com",
          'frame-src': `'self' https://www.surveymonkey.com  ...`,
          'img-src': `'self' data: https://t.co https://analytics.twitter.com ...`,
          'manifest-src': "'self'",
          'media-src': "'self' https://wubrfk.cloudfront.net",
          'worker-src': "'none'",
        },
      },
    },

when I am running my Gatsby V5 build I got this error in the console:

What is the best way to fix this error without using unsafe-eval?
When I add 'sha256-..' to my 'script-src': it doesn't help.

Why is this plugin better than just adding a CSP header to the html.js?

Unless I'm missing something, might be helpful to list the advantages (if any?) in the README for why this plugin is better than just adding a CSP header to the html.js.

disableOnDev flag is printed to HTML

The disableOnDev flag should be deleted from the output prior to printing to HTML. Currently it is:

Which throws an error in Chrome

Status of this plugin / repo?

Hey it looks like this repo is a bit abandoned - is this still under active development?

👻

CSP meta `content` is escaped

A production build puts the following in my head, as seen in curl:

<meta
  http-equiv="Content-Security-Policy"
  content="script-src &#x27;self&#x27; &#x27;sha256-<hash>&#x27; &#x27;<hash>&#x27;;"
/>

The 's are being escaped to ', which is breaking the CSP. It looks like createElement is escaping the HTML entities, so this meta tag might need to be constructed a different way.

Lots of inline style and script errors are being thrown

Hello, I'm noticing the plugin is only adding a small portion of the required inline scripts/styles which is throwing errors and breaking my site.

My plugin config looks like:

{
      resolve: `gatsby-plugin-csp`,
      options: {
        disableOnDev: true,
        reportOnly: false,
        mergeScriptHashes: true,
        mergeStyleHashes: true,
        mergeDefaultDirectives: true,
        directives: {
          "script-src":
            "'self' connect.facebook.net cdn.paddle.com www.googletagmanager.com platform.twitter.com www.google-analytics.com",
          "style-src": "'self' cdn.paddle.com fonts.googleapis.com",
          "frame-src":
            "'self' platform.twitter.com staticxx.facebook.com www.facebook.com",
          "font-src": "'self' fonts.gstatic.com",
        },
      },
    }

This generates a CSP like:

<meta http-equiv="Content-Security-Policy" content="base-uri 'self'; default-src 'self'; script-src 'self' connect.facebook.net cdn.paddle.com www.googletagmanager.com platform.twitter.com www.google-analytics.com 'sha256-2I8frYfptF6frO2QLIwaKfnX3RYbfJ55/LQd5cBiOmg=' 'sha256-egpbluqkD8NT0bY3bWy7raM9tRIMkfUWboq0Y8KqsFk=' 'sha256-X0BXQu2gfi2ZRiq3dkicOdLVJ1mE9T/O7q5NN/iC6k8='; style-src 'self' cdn.paddle.com fonts.googleapis.com 'sha256-8uxjNeXp0ypX1vV3TIfEPA8PK2IsBew4lwb7k6E+v0Q='; object-src 'none'; form-action 'self'; font-src 'self' fonts.gstatic.com; connect-src 'self'; img-src 'self' data:; frame-src 'self' platform.twitter.com staticxx.facebook.com www.facebook.com;">

You can see there's only a small handful of whitelisted inline scripts in the generated policy and dozens of inline-script/styles errors are thrown on load.

We're using Gatsby v2.17.15 with gatsby-plugin-sass for styles. The problem remains even if I remove the directives node from this plugin.

Any help would be appreciated, thank you.

Warning: Each child in a list should have a unique "key" prop.

Upon installing the plugin, I started getting warnings in the console:

Warning: Each child in a list should have a unique "key" prop.

Check the top-level render call using <head>. See https://fb.me/react-warning-keys for more information.
    in meta

Not sure if it's important to be fixed. Will appreciate your attention.

bejamas / gatsby-plugin-csp Goto Github PK

gatsby-plugin-csp's People

Stargazers

Watchers

Forkers

gatsby-plugin-csp's Issues

Recommend Projects

Recommend Topics

Recommend Org

Jobs