@things-factory/shell 6.2.165 → 6.2.167

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@things-factory/shell",
-  "version": "6.2.165",
+  "version": "6.2.167",
   "description": "Core module for framework",
   "bin": {
     "things-factory": "bin/things-factory",
@@ -134,5 +134,5 @@
     "pg": "^8.7.3",
     "sqlite3": "^5.0.8"
   },
-  "gitHead": "7c1bf77d9da08bda3a74d11a0c62cac678c9720f"
+  "gitHead": "c0b528ac67d7cd766d901e0e2f74ae39ef648cab"
 }

package/server/server-dev.ts

@@ -26,6 +26,7 @@ import { historyApiFallback } from 'koa2-connect-history-api-fallback'
 import { WebSocketServer } from 'ws'
 import co from 'co'
 import http from 'http'
+import crypto from 'crypto'
 
 import koaWebpack from '@hatiolab/koa-webpack'
 import cors from '@koa/cors'
@@ -113,6 +114,23 @@ const bootstrap = async () => {
     })
   )
 
+  app.use(async (ctx, next) => {
+    ctx.set('X-Content-Type-Options', 'nosniff')
+
+    const { directives = {} } = config.get('CSP') || {}
+
+    const nonce = crypto.randomBytes(16).toString('base64')
+    ctx.state.nonce = nonce
+
+    const cspHeader = Object.entries(directives as { [key: string]: string[] })
+      .map(([key, value]) => `${key} ${value.join(' ')}`)
+      .join('; ')
+
+    ctx.set('Content-Security-Policy', cspHeader)
+
+    await next()
+  })
+
   var subscriptionMiddleware = []
   process.emit('bootstrap-module-subscription' as any, app, subscriptionMiddleware)
 

package/server/server.ts

@@ -26,6 +26,7 @@ import { historyApiFallback } from 'koa2-connect-history-api-fallback'
 import { WebSocketServer } from 'ws'
 import co from 'co'
 import http from 'http'
+import crypto from 'crypto'
 
 import cors from '@koa/cors'
 import { config, loader, logger, orderedModuleNames } from '@things-factory/env'
@@ -88,6 +89,23 @@ const bootstrap = async () => {
     })
   )
 
+  app.use(async (ctx, next) => {
+    ctx.set('X-Content-Type-Options', 'nosniff')
+
+    const { directives = {} } = config.get('CSP') || {}
+
+    const nonce = crypto.randomBytes(16).toString('base64')
+    ctx.state.nonce = nonce
+
+    const cspHeader = Object.entries(directives as { [key: string]: string[] })
+      .map(([key, value]) => `${key} ${value.join(' ')}`)
+      .join('; ')
+
+    ctx.set('Content-Security-Policy', cspHeader)
+
+    await next()
+  })
+
   var subscriptionMiddleware = []
   process.emit('bootstrap-module-subscription' as any, app, subscriptionMiddleware)
 

package/static/index.js

@@ -0,0 +1,5 @@
+if ('serviceWorker' in navigator) {
+  navigator.serviceWorker.register('/service-worker.js', {
+    scope: '/'
+  })
+}

package/views/dependencies-view-graphviz.html

@@ -1,8 +1,16 @@
-<script src="//d3js.org/d3.v4.min.js"></script>
+<script src="https://unpkg.com/d3@5.15.0/dist/d3.min.js"></script>
 <script src="https://unpkg.com/viz.js@1.8.0/viz.js" type="javascript/worker"></script>
 <script src="https://unpkg.com/d3-graphviz@1.3.1/build/d3-graphviz.min.js"></script>
 
-<div id="graph" style="text-align: center; width: 100%; height: 100%;"></div>
+<style nonce="<%= nonce %>">
+  #graph {
+    text-align: center;
+    width: 100%;
+    height: 100%;
+  }
+</style>
+
+<div id="graph"></div>
 
 <script>
     var model = <%- JSON.stringify(model) %>;

package/views/dependencies-view.html

@@ -1,4 +1,4 @@
-<style>
+<style nonce="<%= nonce %>">
   svg {
     width: 100%;
     height: 100%;
@@ -34,7 +34,7 @@
 <script src="//d3js.org/d3.v3.min.js"></script>
 <script src="//cdn.jsdelivr.net/npm/d3-graphviz@2.6.1/build/d3-graphviz.min.js"></script>
 
-<script>
+<script nonce="<%= nonce %>">
   var model = <%- JSON.stringify(model) %>;
 
   var { edges: links, nodes } = model

package/views/graphql.html

@@ -1,12 +1,18 @@
-<style>
+<style nonce="<%= nonce %>">
   body {
     margin: 0;
   }
+
+  #embedded-sandbox {
+    width: 100%;
+    height: 100%;
+  }
 </style>
 
-<div style="width: 100%; height: 100%" id="embedded-sandbox"></div>
+<div id="embedded-sandbox"></div>
+
 <script src="https://embeddable-sandbox.cdn.apollographql.com/_latest/embeddable-sandbox.umd.production.min.js"></script>
-<script>
+<script nonce="<%= nonce %>">
   new window.EmbeddedSandbox({
     target: '#embedded-sandbox',
     initialEndpoint: '<%- initialEndpoint %>',

package/views/public/home.html

@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
   <head>
     <meta charset="utf-8" />
@@ -54,28 +54,7 @@
     <link href="/node_modules/@material-design-icons/font/index.css" rel="stylesheet" />
     <link rel="stylesheet" href="/theme.css" />
 
-    <style>
-      body {
-        margin: 0;
-        padding: 0;
-        overflow: auto;
-
-        /* This is a font-stack that tries to use the system-default sans-serifs first */
-        font-family: Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
-        line-height: 1.5;
-        -webkit-font-smoothing: antialiased;
-
-        accent-color: var(--primary-color);
-      }
-    </style>
-
-    <script>
-      if ('serviceWorker' in navigator) {
-        navigator.serviceWorker.register('/service-worker.js', {
-          scope: '/'
-        })
-      }
-    </script>
+    <script src="/static/index.js" defer></script>
 
     <!--- prefetch -->
     <link rel="prefetch" href="/public/home.js" />

package/views/template.html

@@ -4,7 +4,7 @@
     <meta charset="utf-8" />
     <meta name="google" content="notranslate" />
 
-    <style>
+    <style nonce="<%= nonce %>">
       html,
       body {
         margin: 0;