search

sveltejs / kit

web development, streamlined
https://svelte.dev/docs/kit
MIT License
18.77k stars 1.96k forks source link

Prerendered pages with static adapter not working unless "unsafe-inline" is used in content security policy when deployed to IIS #11009

Open chirudeepnamini opened 1 year ago

chirudeepnamini commented 1 year ago

Describe the bug

I am using Static adapter with sveltekit. My adapter configuration is as follows:

**import adapter from '@sveltejs/adapter-static';

export default { kit: { adapter: adapter({ // default options are shown. On some platforms // these options are set automatically — see below pages: 'build', assets: 'build', fallback: undefined, precompress: false, strict: true }), csp:{ mode:"hash", directives: { 'script-src': ['self'] },

    }

}

}; This will render the pages after building . for example i took a simple code of counter increment and decrement in svelte. The code: in +page.svelte of routes directory.

count is {count}

<button on:click={()=>count++}>increment <button on:click={()=>count--}>decrement**

After running npm run build, it produced the index.html of in build for this route. The code of the html:

**<!DOCTYPE html>

count is 0

** As you can see a hash is generated and added to content security policy in the html. But when i deploy this to IIS with the web.config: ** ** The site isn't working anymore. Console gave the error: Refused to execute inline script because it violates the following Content Security Policy directive: "script-src 'self'". Either the 'unsafe-inline' keyword, a hash ('sha256-vcM02ybV5AL1ye50l3REFlx7X0T57ATTV3r3Dywhv58='), or a nonce ('nonce-...') is required to enable inline execution. And this executes as expected when "script-src 'self' " is removed from web.config file. ### Reproduction I have uploaded the code(including the build folder with web.config) for reproduction here: https://github.com/chirudeepnamini/sveltekit-issue ### Logs ```Shell Refused to execute inline script because it violates the following Content Security Policy directive: "script-src 'self'". Either the 'unsafe-inline' keyword, a hash ('sha256-vcM02ybV5AL1ye50l3REFlx7X0T57ATTV3r3Dywhv58='), or a nonce ('nonce-...') is required to enable inline execution. ``` ### System Info ```Shell System: OS: Windows 11 10.0.22000 CPU: (12) x64 11th Gen Intel(R) Core(TM) i5-11400 @ 2.60GHz Memory: 4.69 GB / 15.63 GB Binaries: Node: 18.16.1 - C:\Program Files\nodejs\node.EXE npm: 9.5.1 - C:\Program Files\nodejs\npm.CMD pnpm: 8.7.5 - ~\AppData\Roaming\npm\pnpm.CMD Browsers: Edge: Spartan (44.22000.120.0), Chromium (118.0.2088.76) Internet Explorer: 11.0.22000.120 npmPackages: @sveltejs/adapter-auto: ^2.0.0 => 2.1.1 @sveltejs/adapter-static: ^2.0.3 => 2.0.3 @sveltejs/kit: ^1.20.4 => 1.27.4 svelte: ^4.0.5 => 4.2.2 vite: ^4.4.2 => 4.5.0 ``` ### Severity blocking all usage of SvelteKit ### Additional Information The problem is orginally in my other project. but i have reproduced it in a simple project in similar situation. And this is first time iam raising a github issue.So, let me know if i have missed anything.
chirudeepnamini commented 1 year ago

Realized that we don't need to add Content security policy in IIS web.config, when we add csp in sveltekit.

janopae commented 3 months ago

Browsers don't allow "unsafe-inline" for browser extensions. But adapter-static even uses inline scripts when you disable prerendering. I'm a bit clueless on how to use SvelteKit for web extensions because of this.