1

We are trying to implement Content security policy in our web application. Our application stack is MERN.Using helmet package we are trying to implement Content security policy in node js .

Currently We have enabled reportOnly mode in production for testing purpose and facing this error only in our production not in development or staging environments. Effective-attribute is script-src-elem and user agent is Window 10 chrome user-agent. We are confused how to proceed with this error as it impacting on our own script and some other valid sources randomly.We are confused whether to enforce CSP in production or not?

I'm facing a issue. script-src-elem is blocked although defined in script-src. I am using node js . Using helmet package,we have configured csp.my csp list for reference is -

app.use(
  helmet.contentSecurityPolicy({
    reportOnly: true,
    setAllHeaders: false,
    directives: {
      defaultSrc: ['*', 'data:', 'ws:'],
      imgSrc: [
        '*.sample.com',
        'https:',
        'blob:',
        'data:'          ],
      styleSrc: [
        "'self'",
        "'unsafe-inline'",
        'assets.sample.com',
        'https://fonts.googleapis.com',
        'https://accounts.google.com',
        'data:',
        'blob:',
      ],
      scriptSrc: [
        "'self'",
        "'unsafe-inline'",
        "'unsafe-eval'",
        'data:',
        'blob:',
          'https://*.sample.com',
          'https://*.google-analytics.com',
          'https://*.facebook.net',
          'https://*.google.com',
          
        ],
      ],
      frameAncestors: ["'self'"],
      workerSrc: ["'self'", 'blob:'],
      objectSrc: ["'none'"],
      reportUri: '/violation',
    },
  }),
);

I'm facing csp violation under script-src-elem for url https://assets.sample.com/build/resultpage.9cff494c01ced7b4.chunk.js , https://connect.facebook.net. I am not aware what mistake has been commited in the configuration. Can somenone help us out!!! Thanks in advance.

  • Could you provide exact violation message from the Chrome console? – granty Feb 20 '21 at 02:06
  • @granty Currently We have enabled reportOnly mode in production and facing this error only in our production not in development or staging environments. Effective-attribute is script-src-elem happening only in Window 10 chrome user-agent. We are confused how to proceed with this and whether to enforce CSP in production? – user9025499 Feb 20 '21 at 12:41
  • You do know some way about this error, therefore you either observe it in browser console or in the violation reports. For investigating it need to see original console message or violation report. CSP spec does not use `effective-attribute` term, but uses `effective-directive`. The last one always is used by Chrome browser in the violation reports instead of `script-src`. BTW it's a good idea to add `'report-sample'` token to the `script-src` directive. Maybe code samples will shed light on what's going on. – granty Feb 20 '21 at 22:37
  • I have the exact same issue. Did you or anyone else solve it? – jfhector Nov 23 '22 at 17:03

1 Answers1

0

I am not sure if you have defined your strings correctly. You are giving the protocol prefix of the url in the string and I believe that isn't correct. Entries like

scriptSrc: [
        "'self'",
        "'unsafe-inline'",
        "'unsafe-eval'",
        'data:',
        'blob:',
          'https://*.sample.com',
          'https://*.google-analytics.com',
          'https://*.facebook.net',
          'https://*.google.com',
          
        ],

should probably be

scriptSrc: [
            "'self'",
            "'unsafe-inline'",
            "'unsafe-eval'",
            'data:',
            'blob:',
              '*.sample.com',
              '*.google-analytics.com',
              '*.facebook.net',
              '*.google.com',
              
            ],

Try that and see if it helps

Tilman Oe
  • 23
  • 5
  • @Timan Oe Thanks for your quick response. It happens only in chrome on windows 10.script-src-elem is the violated attribute. Will the protocol prefix will be an impact? – user9025499 Feb 19 '21 at 12:10
  • I think you need to test this yourself. If you take a look at the helmet examples, the protocol is not present in any CSP rules. I have also used CSP rules in different frameworks and they usually just contain the domain. Also you can use scriptSrcElem like in this answer: https://stackoverflow.com/questions/64762132/how-do-i-set-up-helmet-js-correctly-to-resolve-csp-issue If you declare your CSP rules in a seperate list you don't have to declare the same rules all over again – Tilman Oe Feb 19 '21 at 12:26
  • Thanks @Tilman Oe. I'll try that one and update here – user9025499 Feb 19 '21 at 12:51
  • great, please upvote and mark as the correct answer if my suggestion has worked out for you! – Tilman Oe Feb 19 '21 at 12:52
  • 1
    Syntax `https://*.sample.com` with scheme is absolutely correct. – granty Feb 20 '21 at 02:04
  • @Tilman Oe removing protocol not have any new impact and unable to configure ScriptSrcElem in helmet.Currently we re using reportOnly mode in production. Forgot to mention, error is occuring only in our production environment not in staging / dev environments.(user-agent:Windows 10 Chrome). We are confused whether to enforce csp violation in production or not!! Can you help me out? – user9025499 Feb 20 '21 at 12:39