server CSP

[jgadsden]

Describe what problem your feature request solves:
The server needs to implement a content security policy

Describe the solution you'd like:
use the package express-csp-header
or alternatively extend helmet: td.server/src/config/securityheaders.config.js

Additional context:
It would be good to add NONCE
Some incomplete work was done to add CSP in pull request #1040

[jgadsden]

CSP is blocking need SCSS etc:

Refused to load the stylesheet 'https://fonts.googleapis.com/css?family=Ubuntu:400,700' because it violates the following Content Security Policy directive: "style-src 'self'". Note that 'style-src-elem' was not explicitly set, so 'style-src' is used as a fallback.

index.mjs:519 Refused to apply inline style because it violates the following Content Security Policy directive: "style-src 'self'". Either the 'unsafe-inline' keyword, a hash ('sha256-KhmMaPpQqsccf43BLHwDHtDMqYihq39cTA4Ag6B4Ia4='), or a nonce ('nonce-...') is required to enable inline execution.

Tt @ index.mjs:519
Show 1 more frame
Show less
config.js:18 FETCHING
config.js:33 LOADED [object Object]
index.js:118 Error compiling schema, function code: const schema2 = scope.schema[2];const schema1 = scope.schema[1];return function validate1(data, {instancePath="", parentData, parentDataProperty, rootData=data}={}){let vErrors = null;let errors = 0;const _errs1 = errors;if(!(((typeof data == "number") && (!(data % 1) && !isNaN(data))) && (isFinite(data)))){validate1.errors = [{instancePath,schemaPath:"#/definitions/nonNegativeInteger/type",keyword:"type",params:{type: "integer"},message:"must be integer"}];return false;}if(errors === _errs1){if((typeof data == "number") && (isFinite(data))){if(data < 0 || isNaN(data)){validate1.errors = [{instancePath,schemaPath:"#/definitions/nonNegativeInteger/minimum",keyword:"minimum",params:{comparison: ">=", limit: 0},message:"must be >= 0"}];return false;}}}validate1.errors = vErrors;return errors === 0;}
d @ index.js:118
Show 1 more frame
Show less
vue-router.esm.js:2316 EvalError: Refused to evaluate a string as JavaScript because 'unsafe-eval' is not an allowed source of script in the following Content Security Policy directive: "script-src 'self'".

    at new Function (<anonymous>)
    at l.d (index.js:89:30)
    at l.p (index.js:148:47)
    at l.u (index.js:142:46)
    at Object.code (ref.js:19:47)
    at J (index.js:464:13)
    at index.js:185:25
    at k.code (index.js:439:13)
    at k.block (index.js:568:18)
    at R (index.js:185:13)
o @ vue-router.esm.js:2316
Show 1 more frame
Show less
threatmodel-import.0de1f869.js:1 Uncaught (in promise) ReferenceError: Cannot access 'Z' before initialization
    at Module.default (threatmodel-import.0de1f869.js:1:818)
    at vue-router.esm.js:2118:39
    at vue-router.esm.js:2203:15
(index):1 Refused to load the image 'data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30'%3E%3Cpath stroke='rgba(51, 51, 51, 0.5)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E' because it violates the following Content Security Policy directive: "img-src 'self'".

(index):1 Refused to load the stylesheet 'https://fonts.googleapis.com/css?family=Ubuntu:400,700' because it violates the following Content Security Policy directive: "style-src 'self'". Note that 'style-src-elem' was not explicitly set, so 'style-src' is used as a fallback.

3threatmodel-import.0de1f869.js:1 Uncaught (in promise) ReferenceError: Cannot access 'Z' before initialization
    at Module.default (threatmodel-import.0de1f869.js:1:818)
    at vue-router.esm.js:2118:39
    at vue-router.esm.js:2203:15
default @ threatmodel-import.0de1f869.js:1
(anonymous) @ vue-router.esm.js:2118
(anonymous) @ vue-router.esm.js:2203
Promise.then
(anonymous) @ vue-router.esm.js:2150
(anonymous) @ vue-router.esm.js:2171
(anonymous) @ vue-router.esm.js:2171
Kt @ vue-router.esm.js:2170
(anonymous) @ vue-router.esm.js:2106
h @ vue-router.esm.js:2362
r @ vue-router.esm.js:2087
r @ vue-router.esm.js:2091
r @ vue-router.esm.js:2091
qt @ vue-router.esm.js:2095
te.confirmTransition @ vue-router.esm.js:2392
te.transitionTo @ vue-router.esm.js:2260
e.push @ vue-router.esm.js:2715
Oe.push @ vue-router.esm.js:3039
O @ vue-router.esm.js:1139
Vn @ vue.runtime.esm.js:3033
n @ vue.runtime.esm.js:1832
Fa.o._wrapper @ vue.runtime.esm.js:7500

[jgadsden]

@@ -1,3 +1,5 @@
import { expressCspHeader, NONE, SELF } from 'express-csp-header';

import express from 'express';
@@ -23,6 +25,19 @@ const limiter = rateLimit({
});

const cspDirectives = {
    directives: {
        'default-src': [SELF],
        'frame-ancestors': [NONE],
        'form-action': [NONE],
        'script-src': [SELF],
        'style-src': [SELF],
        'img-src': [SELF],
        'worker-src': [NONE],
        'block-all-mixed-content': true
    }
};

const create = () => {
@@ -46,6 +61,7 @@ const create = () => {
        app.use(https.middleware);
        app.use(expressCspHeader(cspDirectives));

        // static content

[KapilSareen]

Hi @jgadsden, I’m interested in working on this issue. Are you currently working on it, or would it be possible for me to contribute? Thanks!