Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Problems with CSP #86

Open
budarin opened this issue Oct 18, 2022 · 13 comments
Open

Problems with CSP #86

budarin opened this issue Oct 18, 2022 · 13 comments

Comments

@budarin
Copy link

budarin commented Oct 18, 2022

There is a code in the library

try {
  new Function('')
} catch(error) {
  // if eval variants are not supported, do not create inline object readers ever
  inlineObjectReadThreshold = Infinity
}

It causes problems when using Trustedtypes on the site

{
   "csp-report":{
      "document-uri":"https://site/",
      "referrer":"",
      "violated-directive":"script-src",
      "effective-directive":"script-src",
      "original-policy":"default-src 'none'; child-src 'self'; connect-src 'self'; upgrade-insecure-requests; script-src 'self' 'strict-dynamic' ...sha256 hashes...  'report-sample'; require-trusted-types-for 'script'; trusted-types webpack-tt default; form-action 'self'; base-uri 'none'; manifest-src 'self'; object-src 'none'; report-uri csp-report; frame-ancestors 'none'; img-src 'self' data: ; style-src 'self' 'unsafe-inline' 'report-sample'; worker-src 'self';",
      "disposition":"enforce",
      "blocked-uri":"eval",
      "line-number":2,
      "column-number":9822,
      "source-file":"https://site/c1091830662e60c6d816.js",
      "status-code":200,
      "script-sample":"(function anonymous(\n) {\n\n})"
   }
}

In addition to the fact that the code generates an error, it is also blocked

@budarin
Copy link
Author

budarin commented Oct 18, 2022

I have such a policy on the website

if (window.trustedTypes && window.trustedTypes.createPolicy) {
    window.trustedTypes.createPolicy('default', {
        createScriptURL: (urlStr: string) => {
            if (typeof urlStr !== 'string') {
                throw new TypeError('invalid URL');
            }

            const url = new URL(urlStr, window.location.origin);

            if (url.origin !== window.location.origin) {
                throw new TypeError('invalid URL');
            }

            return urlStr;
        },

        createScript: (string) => string,
    });
}

But the code above still causes an CSP error

I started debugging the code and looked at the error in catch

Refused to evaluate a string as JavaScript because 'unsafe-eval' is not an allowed source of script in the following Content Security Policy directive: "script-src 'self' 'strict-dynamic' 'sha512-hashes ...'  'report-sample'".

stack: EvalError: Refused to evaluate a string as JavaScript because 'unsafe-eval' is not an allowed source of script in the following Content Security Policy directive: "script-src 'self' 'strict-dynamic' 'sha512-hashes...'  'report-sample'".
    at new Function (<anonymous>)
    ...

@kriszyp
Copy link
Owner

kriszyp commented Oct 19, 2022

So you are getting an error thrown before the unpack.js module even starts running (so the try/catch won't catch this). I suppose maybe I could add something to the build script to generate an unpack-safe.js or unpack-noeval.js that strips out the new Function code. Do you think that would work?

@budarin
Copy link
Author

budarin commented Oct 19, 2022

If this code is no longer present in the library, it will definitely help

But the decision to split the code into 2 because of one line is not very optimal...

@budarin budarin changed the title Problems with Trustedtypes Problems with CSP Oct 25, 2022
@kriszyp
Copy link
Owner

kriszyp commented Nov 13, 2022

This should be addressed in v1.8.0, with a separate dist/build of msgpackr that does not use Function.

@budarin
Copy link
Author

budarin commented Nov 13, 2022

Thanks!
how can this be implemented?
is there a description in the documentation?

@kriszyp
Copy link
Owner

kriszyp commented Nov 13, 2022

It is the dist/index-no-eval.js file (and yes, it is in the docs).

@budarin
Copy link
Author

budarin commented Nov 13, 2022

Thanks!
will read and try

@budarin
Copy link
Author

budarin commented Nov 13, 2022

I'm sorry but I get error when try to import

import { Packr } from 'msgpackr/dist/index-no-eval';

webpack error:

[0] ERROR in ./src/client/index.ts 1:0-52
[0] Module not found: Error: Package path ./dist/index-no-eval is not exported from package /Users/project/node_modules/msgpackr (see exports field in /Users/projects/node_modules/msgpackr/package.json)

also Typescript types do not work with such an import

@budarin
Copy link
Author

budarin commented Nov 14, 2022

you need to add to package.json entry

  "files": [
    "dist/**",
  ]

@kriszyp
Copy link
Owner

kriszyp commented Nov 21, 2022

Sorry, I didn't realize you were loading these as modules. Are you wanting to load the entire msgpackr bundle as a module, or specifically the unpack module (without Function/eval)?

@budarin
Copy link
Author

budarin commented Nov 21, 2022

on the server I use only the unpack module and this is what I use CSP I need a module without eval

@kriszyp
Copy link
Owner

kriszyp commented Nov 28, 2022

Published and export (msgpackr/unpack-no-eval) in v1.8.1.

@budarin
Copy link
Author

budarin commented Nov 28, 2022

everything is ok with the import, but the types for this module are not available (

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants