Content Security Policy: The page’s settings blocked the loading of a resource at inline (“script-src”)

Question

I have configured s3 Static website + CloudFront with lambda@Edge + aws cognito. When I open Cloudfront URL after authenticating with cognito it shows above errors that it is not able to load the page due to security issues.

Repo: https://github.com/qoomon/aws-s3-bucket-browser

Link to refer: https://medium.com/@saurishkar/setting-up-aws-http-authentication-on-cloudfront-s3-using-cognito-and-lambda-edge-166ee38d471e

added below line to HTML but still gives an error.

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

Error: Content Security Policy: The page’s settings blocked the loading of a resource at inline (“script-src”)

Error Screenshot

Any help appreciated.

Answer 1

CSPs can be expressed in HTTP headers and in HTML <meta> tags, but HTTP headers trump <meta> tags.

If you added a CSP using a <meta> tag but you have CSP related error messages before, then you haven't done anything useful since the existing HTTP headers will override the <meta> tag.

Remove the <meta> tag again. Then change the HTTP headers.