Merged PR 738: Updated csp and headers

Updated csp and headers

Related work items: #7220

components/homepage/login.js

@@ -124,16 +124,16 @@ let Login = (props) => {
     // const [showSpinnerState, setShowSpinnerState] = useState(false);
     const [validLoginID, setValidLoginID] = useState(null);
 
-    console.log(
-        "built login url path:",
-        props.govGateway.config.authorization_endpoint +
-            "?response_type=code&scope=openid&client_id=" +
-            GG_CLIENT_ID +
-            "&redirect_uri=" +
-            GG_REDIRECT_URI +
-            "&ui_locales=" +
-            (router.locale == "cy" ? "cy" : "en-GB")
-    );
+    // console.log(
+    //     "built login url path:",
+    //     props.govGateway.config.authorization_endpoint +
+    //         "?response_type=code&scope=openid&client_id=" +
+    //         GG_CLIENT_ID +
+    //         "&redirect_uri=" +
+    //         GG_REDIRECT_URI +
+    //         "&ui_locales=" +
+    //         (router.locale == "cy" ? "cy" : "en-GB")
+    // );
 
     // let spinnerState = () => {
     //     showSpinnerState == true

components/tracking/index.js

@@ -1,8 +1,9 @@
 import React, { Fragment } from "react";
 
-export const Tracking = ({ googleTagManagerID }) => (
+export const Tracking = ({ googleTagManagerID, nonce }) => (
     <Fragment>
         <script
+            nonce={nonce}
             dangerouslySetInnerHTML={{
                 __html: `(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
 					new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],

next.config.js

@@ -27,14 +27,30 @@ const securityHeaders = [
         key: "X-Frame-Options",
         value: "SAMEORIGIN",
     },
+    {
+        key: "X-Content-Type-Options",
+        value: "nosniff",
+    },
+    {
+        key: "X-Permitted-Cross-Domain-Policies",
+        value: "none",
+    },
+    {
+        key: "Referrer-Policy",
+        value: "origin-when-cross-origin", //no-referrer
+    },
     {
         key: "Strict-Transport-Security",
         value: "max-age=63072000; includeSubDomains; preload",
     },
     {
-        key: "Content-Security-Policy",
-        value: "frame-src 'self'; child-src 'self'",
+        key: "X-XSS-Protection",
+        value: "1; mode=block",
     },
+    // {
+    //     key: "Content-Security-Policy",
+    //     value: "frame-src 'self'; child-src 'self';object-src 'none'; script-src 'self' 'https://www.googletagmanager.com' unsafe-inline",
+    // },
 ];
 
 module.exports = {

package.json

@@ -27,6 +27,7 @@
     "jsonpath-plus": "^6.0.1",
     "lodash": "^4.17.21",
     "moment": "^2.29.1",
+    "nanoid": "^3.2.0",
     "next": "^12.0.8",
     "next-redux-wrapper": "^7.0.5",
     "next-translate": "^1.2.0",
@@ -63,4 +64,4 @@
     "eslint-config-next": "^12.0.8",
     "prettier": "2.5.1"
   }
-}
+}

pages/_document.js

@@ -2,6 +2,7 @@ import Document, { Html, Head, Main, NextScript } from "next/document";
 import SkipLink from "../components/skiplink";
 import { Tracking, TrackingNoScript } from "../components/tracking";
 import basicAuthMiddleware from "nextjs-basic-auth-middleware";
+import { nanoid } from "nanoid";
 
 class MyDocument extends Document {
     static async getInitialProps(ctx) {
@@ -38,26 +39,44 @@ class MyDocument extends Document {
     render() {
         const googleTagManagerID = process.env.GOOGLE_TAG_MANAGER || null;
         const { useGATracking } = this.props;
+
+        const generatedNonce = nanoid();
+
+        let csp = ``;
+        csp += `base-uri 'self';`;
+        csp += `form-action 'self';`;
+        csp += `object-src 'none';`;
+        csp += `script-src 'self'  https://www.googletagmanager.com  'nonce-${generatedNonce}' ${
+            process.env.NODE_ENV != "production" ? " 'unsafe-eval';" : " ;"
+        }`;
+        csp += `img-src 'self' https://www.googletagmanager.com https://gov.wales https://www.google-analytics.com 'nonce-${generatedNonce}' data:;`;
+        csp += `style-src 'self' https://fonts.googleapis.com 'unsafe-inline' data:;`;
+
         return (
             <Html lang="en">
                 <Head>
+                    <meta httpEquiv="Content-Security-Policy" content={csp} />
                     {useGATracking && (
-                        <Tracking googleTagManagerID={googleTagManagerID} />
+                        <Tracking
+                            googleTagManagerID={googleTagManagerID}
+                            nonce={generatedNonce}
+                        />
                     )}
                 </Head>
                 <body className="js-enabled">
                     {useGATracking && (
                         <TrackingNoScript
+                            nonce={generatedNonce}
                             googleTagManagerID={googleTagManagerID}
                         />
                     )}
                     {!process.browser && (
                         <>
-                            <script>
+                            <script nonce={generatedNonce}>
                                 window.switchDomain = `{process.env.I18N_DOMAIN}
                                 `
                             </script>
-                            <script>
+                            <script nonce={generatedNonce}>
                                 window.apiRoot = `{process.env.API_ROOT}`
                             </script>
                         </>