@sveltejs/kit 1.0.0-next.371 → 1.0.0-next.372

package/assets/server/index.js

@@ -27,32 +27,34 @@ function to_headers(object) {
  * @param {string[]} types
  */
 function negotiate(accept, types) {
-	const parts = accept
-		.split(',')
-		.map((str, i) => {
-			const match = /([^/]+)\/([^;]+)(?:;q=([0-9.]+))?/.exec(str);
-			if (match) {
-				const [, type, subtype, q = '1'] = match;
-				return { type, subtype, q: +q, i };
-			}
+	/** @type {Array<{ type: string, subtype: string, q: number, i: number }>} */
+	const parts = [];
 
-			throw new Error(`Invalid Accept header: ${accept}`);
-		})
-		.sort((a, b) => {
-			if (a.q !== b.q) {
-				return b.q - a.q;
-			}
+	accept.split(',').forEach((str, i) => {
+		const match = /([^/]+)\/([^;]+)(?:;q=([0-9.]+))?/.exec(str);
 
-			if ((a.subtype === '*') !== (b.subtype === '*')) {
-				return a.subtype === '*' ? 1 : -1;
-			}
+		// no match equals invalid header — ignore
+		if (match) {
+			const [, type, subtype, q = '1'] = match;
+			parts.push({ type, subtype, q: +q, i });
+		}
+	});
 
-			if ((a.type === '*') !== (b.type === '*')) {
-				return a.type === '*' ? 1 : -1;
-			}
+	parts.sort((a, b) => {
+		if (a.q !== b.q) {
+			return b.q - a.q;
+		}
 
-			return a.i - b.i;
-		});
+		if ((a.subtype === '*') !== (b.subtype === '*')) {
+			return a.subtype === '*' ? 1 : -1;
+		}
+
+		if ((a.type === '*') !== (b.type === '*')) {
+			return a.type === '*' ? 1 : -1;
+		}
+
+		return a.i - b.i;
+	});
 
 	let accepted;
 	let min_priority = Infinity;
@@ -975,9 +977,6 @@ function base64(bytes) {
 	return result;
 }
 
-/** @type {Promise<void>} */
-let csp_ready;
-
 const array = new Uint8Array(16);
 
 function generate_nonce() {
@@ -997,13 +996,12 @@ const quoted = new Set([
 
 const crypto_pattern = /^(nonce|sha\d\d\d)-/;
 
-class Csp {
+// CSP and CSP Report Only are extremely similar with a few caveats
+// the easiest/DRYest way to express this is with some private encapsulation
+class BaseProvider {
 	/** @type {boolean} */
 	#use_hashes;
 
-	/** @type {boolean} */
-	#dev;
-
 	/** @type {boolean} */
 	#script_needs_csp;
 
@@ -1019,21 +1017,18 @@ class Csp {
 	/** @type {import('types').Csp.Source[]} */
 	#style_src;
 
+	/** @type {string} */
+	#nonce;
+
 	/**
-	 * @param {{
-	 *   mode: string,
-	 *   directives: import('types').CspDirectives
-	 * }} config
-	 * @param {{
-	 *   dev: boolean;
-	 *   prerender: boolean;
-	 *   needs_nonce: boolean;
-	 * }} opts
+	 * @param {boolean} use_hashes
+	 * @param {import('types').CspDirectives} directives
+	 * @param {string} nonce
+	 * @param {boolean} dev
 	 */
-	constructor({ mode, directives }, { dev, prerender, needs_nonce }) {
-		this.#use_hashes = mode === 'hash' || (mode === 'auto' && prerender);
+	constructor(use_hashes, directives, nonce, dev) {
+		this.#use_hashes = use_hashes;
 		this.#directives = dev ? { ...directives } : directives; // clone in dev so we can safely mutate
-		this.#dev = dev;
 
 		const d = this.#directives;
 
@@ -1075,10 +1070,7 @@ class Csp {
 
 		this.script_needs_nonce = this.#script_needs_csp && !this.#use_hashes;
 		this.style_needs_nonce = this.#style_needs_csp && !this.#use_hashes;
-
-		if (this.script_needs_nonce || this.style_needs_nonce || needs_nonce) {
-			this.nonce = generate_nonce();
-		}
+		this.#nonce = nonce;
 	}
 
 	/** @param {string} content */
@@ -1087,7 +1079,7 @@ class Csp {
 			if (this.#use_hashes) {
 				this.#script_src.push(`sha256-${sha256(content)}`);
 			} else if (this.#script_src.length === 0) {
-				this.#script_src.push(`nonce-${this.nonce}`);
+				this.#script_src.push(`nonce-${this.#nonce}`);
 			}
 		}
 	}
@@ -1098,12 +1090,14 @@ class Csp {
 			if (this.#use_hashes) {
 				this.#style_src.push(`sha256-${sha256(content)}`);
 			} else if (this.#style_src.length === 0) {
-				this.#style_src.push(`nonce-${this.nonce}`);
+				this.#style_src.push(`nonce-${this.#nonce}`);
 			}
 		}
 	}
 
-	/** @param {boolean} [is_meta] */
+	/**
+	 * @param {boolean} [is_meta]
+	 */
 	get_header(is_meta = false) {
 		const header = [];
 
@@ -1134,7 +1128,7 @@ class Csp {
 				continue;
 			}
 
-			// @ts-expect-error gimme a break typescript, `key` is obviously a member of directives
+			// @ts-expect-error gimme a break typescript, `key` is obviously a member of internal_directives
 			const value = /** @type {string[] | true} */ (directives[key]);
 
 			if (!value) continue;
@@ -1155,13 +1149,81 @@ class Csp {
 
 		return header.join('; ');
 	}
+}
 
+class CspProvider extends BaseProvider {
 	get_meta() {
 		const content = escape_html_attr(this.get_header(true));
 		return `<meta http-equiv="content-security-policy" content=${content}>`;
 	}
 }
 
+class CspReportOnlyProvider extends BaseProvider {
+	/**
+	 * @param {boolean} use_hashes
+	 * @param {import('types').CspDirectives} directives
+	 * @param {string} nonce
+	 * @param {boolean} dev
+	 */
+	constructor(use_hashes, directives, nonce, dev) {
+		super(use_hashes, directives, nonce, dev);
+
+		if (Object.values(directives).filter((v) => !!v).length > 0) {
+			// If we're generating content-security-policy-report-only,
+			// if there are any directives, we need a report-uri or report-to (or both)
+			// else it's just an expensive noop.
+			const has_report_to = directives['report-to']?.length ?? 0 > 0;
+			const has_report_uri = directives['report-uri']?.length ?? 0 > 0;
+			if (!has_report_to && !has_report_uri) {
+				throw Error(
+					'`content-security-policy-report-only` must be specified with either the `report-to` or `report-uri` directives, or both'
+				);
+			}
+		}
+	}
+}
+
+class Csp {
+	/** @readonly */
+	nonce = generate_nonce();
+
+	/** @type {CspProvider} */
+	csp_provider;
+
+	/** @type {CspReportOnlyProvider} */
+	report_only_provider;
+
+	/**
+	 * @param {import('./types').CspConfig} config
+	 * @param {import('./types').CspOpts} opts
+	 */
+	constructor({ mode, directives, reportOnly }, { prerender, dev }) {
+		const use_hashes = mode === 'hash' || (mode === 'auto' && prerender);
+		this.csp_provider = new CspProvider(use_hashes, directives, this.nonce, dev);
+		this.report_only_provider = new CspReportOnlyProvider(use_hashes, reportOnly, this.nonce, dev);
+	}
+
+	get script_needs_nonce() {
+		return this.csp_provider.script_needs_nonce || this.report_only_provider.script_needs_nonce;
+	}
+
+	get style_needs_nonce() {
+		return this.csp_provider.style_needs_nonce || this.report_only_provider.style_needs_nonce;
+	}
+
+	/** @param {string} content */
+	add_script(content) {
+		this.csp_provider.add_script(content);
+		this.report_only_provider.add_script(content);
+	}
+
+	/** @param {string} content */
+	add_style(content) {
+		this.csp_provider.add_style(content);
+		this.report_only_provider.add_style(content);
+	}
+}
+
 const absolute = /^([a-z]+:)?\/?\//;
 const scheme = /^[a-z]+:/;
 
@@ -1387,11 +1449,9 @@ async function render_response({
 
 	let { head, html: body } = rendered;
 
-	await csp_ready;
 	const csp = new Csp(options.csp, {
 		dev: options.dev,
-		prerender: !!state.prerendering,
-		needs_nonce: options.template_contains_nonce
+		prerender: !!state.prerendering
 	});
 
 	const target = hash(body);
@@ -1502,7 +1562,7 @@ async function render_response({
 	if (state.prerendering) {
 		const http_equiv = [];
 
-		const csp_headers = csp.get_meta();
+		const csp_headers = csp.csp_provider.get_meta();
 		if (csp_headers) {
 			http_equiv.push(csp_headers);
 		}
@@ -1534,10 +1594,14 @@ async function render_response({
 	}
 
 	if (!state.prerendering) {
-		const csp_header = csp.get_header();
+		const csp_header = csp.csp_provider.get_header();
 		if (csp_header) {
 			headers.set('content-security-policy', csp_header);
 		}
+		const report_only_header = csp.report_only_provider.get_header();
+		if (report_only_header) {
+			headers.set('content-security-policy-report-only', report_only_header);
+		}
 	}
 
 	return new Response(html, {

package/dist/chunks/error.js

@@ -111,6 +111,40 @@ function init(open, close) {
 
 /** @typedef {import('./types').Validator} Validator */
 
+const directives = object({
+	'child-src': string_array(),
+	'default-src': string_array(),
+	'frame-src': string_array(),
+	'worker-src': string_array(),
+	'connect-src': string_array(),
+	'font-src': string_array(),
+	'img-src': string_array(),
+	'manifest-src': string_array(),
+	'media-src': string_array(),
+	'object-src': string_array(),
+	'prefetch-src': string_array(),
+	'script-src': string_array(),
+	'script-src-elem': string_array(),
+	'script-src-attr': string_array(),
+	'style-src': string_array(),
+	'style-src-elem': string_array(),
+	'style-src-attr': string_array(),
+	'base-uri': string_array(),
+	sandbox: string_array(),
+	'form-action': string_array(),
+	'frame-ancestors': string_array(),
+	'navigate-to': string_array(),
+	'report-uri': string_array(),
+	'report-to': string_array(),
+	'require-trusted-types-for': string_array(),
+	'trusted-types': string_array(),
+	'upgrade-insecure-requests': boolean(false),
+	'require-sri-for': string_array(),
+	'block-all-mixed-content': boolean(false),
+	'plugin-types': string_array(),
+	referrer: string_array()
+});
+
 /** @type {Validator} */
 const options = object(
 	{
@@ -189,39 +223,8 @@ const options = object(
 
 			csp: object({
 				mode: list(['auto', 'hash', 'nonce']),
-				directives: object({
-					'child-src': string_array(),
-					'default-src': string_array(),
-					'frame-src': string_array(),
-					'worker-src': string_array(),
-					'connect-src': string_array(),
-					'font-src': string_array(),
-					'img-src': string_array(),
-					'manifest-src': string_array(),
-					'media-src': string_array(),
-					'object-src': string_array(),
-					'prefetch-src': string_array(),
-					'script-src': string_array(),
-					'script-src-elem': string_array(),
-					'script-src-attr': string_array(),
-					'style-src': string_array(),
-					'style-src-elem': string_array(),
-					'style-src-attr': string_array(),
-					'base-uri': string_array(),
-					sandbox: string_array(),
-					'form-action': string_array(),
-					'frame-ancestors': string_array(),
-					'navigate-to': string_array(),
-					'report-uri': string_array(),
-					'report-to': string_array(),
-					'require-trusted-types-for': string_array(),
-					'trusted-types': string_array(),
-					'upgrade-insecure-requests': boolean(false),
-					'require-sri-for': string_array(),
-					'block-all-mixed-content': boolean(false),
-					'plugin-types': string_array(),
-					referrer: string_array()
-				})
+				directives,
+				reportOnly: directives
 			}),
 
 			// TODO: remove this for the 1.0 release
@@ -410,7 +413,7 @@ const options = object(
  * @param {boolean} [allow_unknown]
  * @returns {Validator}
  */
-function object(children, allow_unknown) {
+function object(children, allow_unknown = false) {
 	return (input, keypath) => {
 		/** @type {Record<string, any>} */
 		const output = {};

package/dist/cli.js

@@ -18,7 +18,7 @@ function handle_error(e) {
 	process.exit(1);
 }
 
-const prog = sade('svelte-kit').version('1.0.0-next.371');
+const prog = sade('svelte-kit').version('1.0.0-next.372');
 
 prog
 	.command('package')

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sveltejs/kit",
-  "version": "1.0.0-next.371",
+  "version": "1.0.0-next.372",
   "repository": {
     "type": "git",
     "url": "https://github.com/sveltejs/kit",

package/types/index.d.ts

@@ -105,6 +105,7 @@ export interface KitConfig {
 	csp?: {
 		mode?: 'hash' | 'nonce' | 'auto';
 		directives?: CspDirectives;
+		reportOnly?: CspDirectives;
 	};
 	moduleExtensions?: string[];
 	files?: {