fix: support different CSPs in meta and headers

shapeshift · Nov 18, 2021 · 563fdf3 · 563fdf3
1 parent 55069a3
commit 563fdf3
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 7 deletions.
diff --git a/headers.js b/headers.js
@@ -1,8 +1,7 @@
 require('dotenv').config()
 
-const csp = Object.entries({
+const cspMeta = Object.entries({
   'default-src': ["'self'"],
-  'frame-ancestors': ["'none'"],
   'connect-src': [
     "'self'",
     'https://api.0x.org',
@@ -41,15 +40,18 @@ const csp = Object.entries({
   .join('; ')
 
 const headers = {
-  'Content-Security-Policy': `${csp}`, // `; report-uri https://shapeshift.report-uri.com/r/d/csp/wizard`,
+  'Content-Security-Policy': `${cspMeta}; frame-ancestors: none`, // `; report-uri https://shapeshift.report-uri.com/r/d/csp/wizard`,
   'Cross-Origin-Opener-Policy': 'same-origin',
   'Permissions-Policy': 'document-domain=()',
   'Referrer-Policy': 'no-referrer',
   'X-Content-Type-Options': 'nosniff',
   'X-Frame-Options': 'DENY'
 }
 
-module.exports = headers
+module.exports = {
+  headers,
+  cspMeta
+}
 if (module.parent) return
 
 require('fs').writeFileSync(

diff --git a/public/index.html b/public/index.html
@@ -3,7 +3,7 @@
   <head>
     <meta charset="utf-8" />
     <meta name="referrer" content="no-referrer">
-    <meta http-equiv="Content-Security-Policy" content="%REACT_APP_CSP%" />
+    <meta http-equiv="Content-Security-Policy" content="%REACT_APP_CSP_META%" />
     <link rel="icon" href="%PUBLIC_URL%/favi-blue.png" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <meta name="theme-color" content="#000000" />

diff --git a/react-app-rewired.config.js b/react-app-rewired.config.js
@@ -2,13 +2,13 @@
  * React App Rewired Config
  */
 const headers = require('./headers')
-process.env.REACT_APP_CSP = headers['Content-Security-Policy'] ?? ''
+process.env.REACT_APP_CSP_META = headers.cspMeta ?? ''
 
 module.exports = {
   devServer: configFunction => {
     return (proxy, allowedHost) => {
       const config = configFunction(proxy, allowedHost)
-      config.headers = headers
+      config.headers = headers.headers
       return config
     }
   }