@things-factory/shell 7.0.44 → 7.0.49

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@things-factory/shell",
-  "version": "7.0.44",
+  "version": "7.0.49",
   "description": "Core module for framework",
   "bin": {
     "things-factory": "bin/things-factory",
@@ -133,5 +133,5 @@
     "pg": "^8.7.3",
     "sqlite3": "^5.0.8"
   },
-  "gitHead": "15c3e1b6a2b5f33c03cca37aabdc5f4c388d7dc9"
+  "gitHead": "3fdc2d9c86f8ebf1470fa5d2155b7b3019df6c0d"
 }

package/server/server-dev.ts

@@ -28,6 +28,9 @@ import http from 'http'
 
 import koaWebpack from '@hatiolab/koa-webpack'
 import cors from '@koa/cors'
+
+import crypto from 'crypto'
+
 import { config, loader, logger, orderedModuleNames } from '@things-factory/env'
 import { initLicense, checkValidity } from '@things-factory/operato-license-checker'
 
@@ -118,6 +121,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

@@ -28,6 +28,8 @@ import co from 'co'
 import http from 'http'
 
 import cors from '@koa/cors'
+import crypto from 'crypto'
+
 import { config, loader, logger, orderedModuleNames } from '@things-factory/env'
 import { initLicense, checkValidity } from '@things-factory/operato-license-checker'
 
@@ -95,6 +97,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,10 +1,18 @@
-<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>
+<script nonce="<%= nonce %>">
     var model = <%- JSON.stringify(model) %>;
 
     var { edges, nodes } = model

package/views/dependencies-view.html

@@ -1,4 +1,4 @@
-<style>
+<style nonce="<%= nonce %>">
   svg {
     width: 100%;
     height: 100%;
@@ -27,14 +27,18 @@
   text {
     font: 10px sans-serif;
     pointer-events: none;
-    text-shadow: 0 1px 0 #fff, 1px 0 0 #fff, 0 -1px 0 #fff, -1px 0 0 #fff;
+    text-shadow:
+      0 1px 0 #fff,
+      1px 0 0 #fff,
+      0 -1px 0 #fff,
+      -1px 0 0 #fff;
   }
 </style>
 
 <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

@@ -56,29 +56,7 @@
     <link href="/node_modules/@fontsource/roboto/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(--md-sys-color-primary);
-        background-color: var(--md-sys-color-background);
-      }
-    </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;