Merge pull request #48 from FZJ-INM1-BDA/feat/restoreCsp

feat: added nonce to testsafari

Merge pull request #48 from FZJ-INM1-BDA/feat/restoreCsp
feat: added nonce to testsafari
351859f1 · xgui3783 · GitHub · 9137a0be · 498e0675 · 351859f1
Unverified Commit 351859f1 authored 5 years ago by xgui3783 Committed by GitHub 5 years ago
--- a/deploy/app.js
+++ b/deploy/app.js
@@ -80,6 +80,18 @@ app.use((_req, res, next) => {
 */
 app.use(require('./devBanner'))

+/**
+ * populate nonce token
+ */
+const indexTemplate = require('fs').readFileSync(
+  path.join(PUBLIC_PATH, 'index.html'),
+  'utf-8'
+)
+app.get('/', (req, res) => {
+  res.setHeader('Content-Type', 'text/html')
+  res.status(200).send(`${indexTemplate.replace(/\$\$NONCE\$\$/g, res.locals.nonce)}`)
+})
+
 /**
 * only use compression for production
 * this allows locally built aot to be served without errors

--- a/deploy/csp/index.js
+++ b/deploy/csp/index.js
 const csp = require('helmet-csp')
 const bodyParser = require('body-parser')
+const crypto = require('crypto')

 let WHITE_LIST_SRC, DATA_SRC, SCRIPT_SRC

@@ -46,6 +47,11 @@ const dataSource = [
 ]

 module.exports = (app) => {
+  app.use((req, res, next) => {
+    res.locals.nonce = crypto.randomBytes(16).toString('hex')
+    next()
+  })
+
  app.use(csp({
    directives: {
      defaultSrc: [
@@ -77,6 +83,7 @@ module.exports = (app) => {
        'unpkg.com',
        '*.unpkg.com',
        '*.jsdelivr.net',
+        (req, res) => `'nonce-${res.locals.nonce}'`,
        ...SCRIPT_SRC,
        ...WHITE_LIST_SRC
      ],

--- a/src/index.html
+++ b/src/index.html
@@ -40,7 +40,37 @@
    </h1>
  </atlas-viewer>

-  <script src="testSafari.js">
+  <script nonce="$$NONCE$$">
+    /**
+    * Catching Safari 10 bug:
+    * 
+    * https://bugs.webkit.org/show_bug.cgi?id=171041
+    * 
+    */
+
+    (function(){
+      try{
+        eval('(()=>{\
+                let e = e => {\
+                  console.log(e);\
+                  for(let e of [1,2,3]){\
+                    console.log(e);\
+                  }\
+                }\
+            })()')
+      } catch (e) {
+        console.log(e)
+        const warning = 'Your browser cannot display the interactive viewer. Please use either Chrome >= 56 and/or Firefox >= 51'
+        console.log(warning)
+        const warningEl = document.createElement('h4')
+        warningEl.innerHTML = warning
+        const el = document.getElementsByTagName('atlas-viewer')
+        if(el.length > 0){
+          document.body.removeChild(el[0])
+        }
+        document.body.appendChild(warningEl)
+      }
+    })()
  </script>
 </body>
 </html>
--- a/src/main-common.ts
+++ b/src/main-common.ts
+// Included to include a copy of vanilla nehuba
+import '!!file-loader?context=third_party&name=vanilla.html!third_party/vanilla.html'
+import '!!file-loader?context=third_party&name=vanilla_styles.css!third_party/styles.css'
+import '!!file-loader?context=third_party&name=vanilla_nehuba.js!third_party/vanilla_nehuba.js'
+
 import 'zone.js'
-import 'third_party/testSafari.js'
 import { enableProdMode } from '@angular/core';

 import * as ConnectivityComponent from 'hbp-connectivity-component/dist/loader'

--- a/third_party/styles.css
+++ b/third_party/styles.css
--- a/third_party/testSafari.js
+++ b/third_party/testSafari.js
-
-/**
-* Catching Safari 10 bug:
-* 
-* https://bugs.webkit.org/show_bug.cgi?id=171041
-* 
-*/
-
-(function(){
-  try{
-    eval('(()=>{\
-            let e = e => {\
-              console.log(e);\
-              for(let e of [1,2,3]){\
-                console.log(e);\
-              }\
-            }\
-        })()')
-  } catch (e) {
-    console.log(e)
-    const warning = 'Your browser cannot display the interactive viewer. Please use either Chrome >= 56 and/or Firefox >= 51'
-    console.log(warning)
-    const warningEl = document.createElement('h4')
-    warningEl.innerHTML = warning
-    const el = document.getElementsByTagName('atlas-viewer')
-    if(el.length > 0){
-      document.body.removeChild(el[0])
-    }
-    document.body.appendChild(warningEl)
-  }
-})()
\ No newline at end of file
--- a/third_party/vanilla.html
+++ b/third_party/vanilla.html
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <meta http-equiv="X-UA-Compatible" content="ie=edge">
+  <title>nehuba</title>
+  
+  <script src="main.bundle.js"></script>
+  <link rel="stylesheet" href="vanilla_styles.css">
+</head>
+<body>
+  <div id="neuroglancer-container"></div>
+</body>
+<footer>
+  <script src="vanilla_nehuba.js"></script>
+</footer>
+</html>
--- a/third_party/vanilla_nehuba.js
+++ b/third_party/vanilla_nehuba.js
+(() => {
+  export_nehuba.createNehubaViewer({}, err => console.error(err))
+})()
\ No newline at end of file