Merge pull request #2736 from dojineko/variable-csp

Multiple policy support for Content-Security-Policy

lib/common/options.js

@@ -317,7 +317,8 @@ Options.defaults = {
     csp: {
       enabled: false,
       hashAlgorithm: 'sha256',
-      allowedSources: []
+      allowedSources: undefined,
+      policies: undefined
     }
   },
   watchers: {

lib/core/middleware/nuxt.js

@@ -68,12 +68,31 @@ module.exports = async function nuxtMiddleware(req, res, next) {
     }
 
     if (this.options.render.csp && this.options.render.csp.enabled) {
-      const allowedSources = cspScriptSrcHashes.concat(this.options.render.csp.allowedSources)
+      const allowedSources = this.options.render.csp.allowedSources
+      const policies = this.options.render.csp.policies ? {...this.options.render.csp.policies} : null
+      let cspStr = `script-src 'self' ${(cspScriptSrcHashes).join(' ')}`
+      if (Array.isArray(allowedSources)) {
+        // For compatible section
+        cspStr = `script-src 'self' ${cspScriptSrcHashes.concat(allowedSources).join(' ')}`
+      } else if (typeof policies === 'object' && policies !== null && !Array.isArray(policies)) {
+        // Set default policy if necessary
+        if (!policies['script-src'] || !Array.isArray(policies['script-src'])) {
+          policies['script-src'] = [`'self'`].concat(cspScriptSrcHashes)
+        } else {
+          policies['script-src'] = cspScriptSrcHashes.concat(policies['script-src'])
+          if (!policies['script-src'].includes(`'self'`)) {
+            policies['script-src'] = [`'self'`].concat(policies['script-src'])
+          }
+        }
 
-      res.setHeader(
-        'Content-Security-Policy',
-        `script-src 'self' ${(allowedSources).join(' ')}`
-      )
+        // Make content-security-policy string
+        let cspArr = []
+        Object.keys(policies).forEach((k) => {
+          cspArr.push(`${k} ${policies[k].join(' ')}`)
+        })
+        cspStr = cspArr.join('; ')
+      }
+      res.setHeader('Content-Security-Policy', cspStr)
     }
 
     // Send response

test/basic.ssr.csp.test.js

@@ -0,0 +1,122 @@
+import test from 'ava'
+import { resolve } from 'path'
+import rp from 'request-promise-native'
+import { Nuxt, Builder } from '..'
+import { interceptLog } from './helpers/console'
+
+const port = 4005
+const url = route => 'http://localhost:' + port + route
+
+// Init nuxt.js and create server listening on localhost:4005
+const startCSPTestServer = async (t, csp) => {
+  const options = {
+    rootDir: resolve(__dirname, 'fixtures/basic'),
+    buildDir: '.nuxt-ssr',
+    dev: false,
+    head: {
+      titleTemplate(titleChunk) {
+        return titleChunk ? `${titleChunk} - Nuxt.js` : 'Nuxt.js'
+      }
+    },
+    build: { stats: false },
+    render: { csp }
+  }
+
+  let nuxt = null
+  const logSpy = await interceptLog(async () => {
+    nuxt = new Nuxt(options)
+    const builder = await new Builder(nuxt)
+    await builder.build()
+    await nuxt.listen(port, '0.0.0.0')
+  })
+
+  t.true(logSpy.calledWithMatch('DONE'))
+  t.true(logSpy.calledWithMatch('OPEN'))
+
+  return nuxt
+}
+
+test.serial('Not contain Content-Security-Policy header, when csp.enabled is not set', async t => {
+  const nuxt = await startCSPTestServer(t, {})
+  const { headers } = await rp(url('/stateless'), {
+    resolveWithFullResponse: true
+  })
+
+  t.is(headers['content-security-policy'], undefined)
+
+  await nuxt.close()
+})
+
+test.serial('Contain Content-Security-Policy header, when csp.enabled is only set', async t => {
+  const cspOption = {
+    enabled: true
+  }
+
+  const nuxt = await startCSPTestServer(t, cspOption)
+  const { headers } = await rp(url('/stateless'), {
+    resolveWithFullResponse: true
+  })
+
+  t.regex(headers['content-security-policy'], /^script-src 'self' 'sha256-.*'$/)
+
+  await nuxt.close()
+})
+
+test.serial('Contain Content-Security-Policy header, when csp.allowedSources set', async t => {
+  const cspOption = {
+    enabled: true,
+    allowedSources: ['https://example.com', 'https://example.io']
+  }
+
+  const nuxt = await startCSPTestServer(t, cspOption)
+  const { headers } = await rp(url('/stateless'), {
+    resolveWithFullResponse: true
+  })
+
+  t.regex(headers['content-security-policy'], /^script-src 'self' 'sha256-.*'/)
+  t.true(headers['content-security-policy'].includes('https://example.com'))
+  t.true(headers['content-security-policy'].includes('https://example.io'))
+
+  await nuxt.close()
+})
+
+test.serial('Contain Content-Security-Policy header, when csp.policies set', async t => {
+  const cspOption = {
+    enabled: true,
+    policies: {
+      'default-src': [`'none'`],
+      'script-src': ['https://example.com', 'https://example.io']
+    }
+  }
+
+  const nuxt = await startCSPTestServer(t, cspOption)
+  const { headers } = await rp(url('/stateless'), {
+    resolveWithFullResponse: true
+  })
+
+  t.regex(headers['content-security-policy'], /default-src 'none'/)
+  t.regex(headers['content-security-policy'], /script-src 'self' 'sha256-.*'/)
+  t.true(headers['content-security-policy'].includes('https://example.com'))
+  t.true(headers['content-security-policy'].includes('https://example.io'))
+
+  await nuxt.close()
+})
+
+test.serial('Contain Content-Security-Policy header, when csp.policies.script-src is not set', async t => {
+  const cspOption = {
+    enabled: true,
+    policies: {
+      'default-src': [`'none'`]
+    }
+  }
+
+  const nuxt = await startCSPTestServer(t, cspOption)
+  const { headers } = await rp(url('/stateless'), {
+    resolveWithFullResponse: true
+  })
+
+  t.regex(headers['content-security-policy'], /default-src 'none'/)
+  t.regex(headers['content-security-policy'], /script-src 'self' 'sha256-.*'/)
+
+  await nuxt.close()
+})

test/basic.ssr.test.js

@@ -9,7 +9,7 @@ const url = route => 'http://localhost:' + port + route
 
 let nuxt = null
 
-// Init nuxt.js and create server listening on localhost:4003
+// Init nuxt.js and create server listening on localhost:4004
 test.serial('Init Nuxt.js', async t => {
   const options = {
     rootDir: resolve(__dirname, 'fixtures/basic'),
@@ -22,12 +22,6 @@ test.serial('Init Nuxt.js', async t => {
     },
     build: {
       stats: false
-    },
-    render: {
-      csp: {
-        enabled: true,
-        allowedSources: ['https://example.com', 'https://example.io']
-      }
     }
   }
 
@@ -253,16 +247,6 @@ test('ETag Header', async t => {
   t.is(error.statusCode, 304)
 })
 
-test('Content-Security-Policy Header', async t => {
-  const { headers } = await rp(url('/stateless'), {
-    resolveWithFullResponse: true
-  })
-  // Verify functionality
-  t.regex(headers['content-security-policy'], /script-src 'self' 'sha256-.*'/)
-  t.true(headers['content-security-policy'].includes('https://example.com'))
-  t.true(headers['content-security-policy'].includes('https://example.io'))
-})
-
 test('/_nuxt/server-bundle.json should return 404', async t => {
   const err = await t.throws(
     rp(url('/_nuxt/server-bundle.json'), { resolveWithFullResponse: true })