sveltejs / kit

web development, streamlined
https://kit.svelte.dev
MIT License
18.4k stars 1.88k forks source link

Dev server adds CORS headers #6455

Open bdougherty opened 2 years ago

bdougherty commented 2 years ago

Describe the problem

I noticed that on dev I was seeing an Access-Control-Allow-Origin: * header on all requests, even though I am not adding it. I checked and it turns out it is the Vite dev server adding this by default. Ideally, dev should be as close of a match to production as possible, so I don't think it's a good thing to leave this on.

Describe the proposed solution

Add cors: false to the server config in the sveltekit Vite plugin.

Alternatives considered

Update the default vite.config.js from create-svelte to disable CORS:

import { sveltekit } from '@sveltejs/kit/vite';

/** @type {import('vite').UserConfig} */
const config = {
    plugins: [sveltekit()],
+   server: {
+       cors: false
+   }
};

export default config;

or do nothing and people must manually configure it.

Importance

nice to have

Additional Information

No response

dominikg commented 2 years ago

There are production servers with and without cors. So one group of users is going to have to change it from the default value. Keeping it off by default in dev might be the safer, but this is something to discuss with vite.

Changing the default value away from vite's default in the kit pluginwould be confusing and requires extra documentation, so if vite does not change it's default and we still want to promote a different value, adding it to the template config would be a better way.

But in general i'd prefer to just stick with the vite default. The dev server is not listening on external interfaces by default so any cors request would have to come from the same host.

bdougherty commented 2 years ago

Same host, but not the same origin. If ports are different, it is a different origin. I noticed this because I was testing one project on dev making a request to another on dev and it worked when I had not added any CORS headers yet.

I guess I will check with the vite people on why it does this by default, but I guess I don't quite understand the reason to defer to them when the SvelteKit production build does not add the header. (So I suppose another possible solution would be for SvelteKit to add the header by default, but I don't think that really makes any sense to do).

KaKi87 commented 7 months ago

TL;DR : the dev server shouldn't enable CORS by default as prod servers don't either, because this behavioral difference is confusing otherwise.


Hello,

While initially unaware that the dev server enables CORS, I didn't notice that I only encountered a CORS error while testing my API routes using the prod server, after which I created a hook that enables CORS only on said API routes.

Later using the dev server though, I noticed that CORS header on a non-API route, leading me to believe that I wrongly wrote my hook, enabling CORS everywhere, which would be a potential security mistake, but I couldn't see where I did something wrong, so I removed it altogether and noticed the header was still there.

Then, it took me a while to stumble on this issue.

However, adding cors: false in vite.config.js doesn't seem to actually disable CORS.

Thanks