Svelte(不是SvelteKit)在客户端的HTTP标头中添加CORS "allow origin ..."

Question

所以我一直有错误:

从'http://localhost:8080'获取'http://localhost:8000/<...>'的访问被CORS策略阻止:请求的资源上没有'Access- control - allow - origin '标头。如果一个不透明的响应满足你的需要，设置请求的模式为'no-cors'来获取CORS禁用的资源。

我想知道如何在一个苗条的网站的HTTP头中添加字段Access-Control-Allow-Origin。我再次精确，我在Svelte上，而不是在SvelteKit上(找到了很多SvelteKit的解决方案)我认为它可以添加main.ts但我得到一个错误,如果我这样做:

const app = new App({
target: document.body,
props: {
name: 'my APP'
},
headers: {
'Access-Control-Allow-Origin': '*' // or, e.g. replacing * by http://localhost:8000
}
});

我得到错误:

Argument of type '{ target: HTMLElement; props: { name: string; }; headers: { 'Access-Control-Allow-Origin': string; }; }' is not assignable to parameter of type 'Svelte2TsxComponentConstructorParameters<any>'.
Object literal may only specify known properties, and 'headers' does not exist in type 'Svelte2TsxComponentConstructorParameters<any>'.ts(2345)

我可以在哪里设置呢?😅

NB。我也发现了这个关于CORS与NodeJS，我可以使用它与Svelte，或者它不会工作?

Answer 1

CORS与苗条无关;服务器必须允许来自另一个源的访问，而不是客户端。因此，无论服务http://localhost:8000必须设置标题。具体怎么做取决于服务器的类型。

可以从REPL下载的示例使用sirv-cli预览编译后的Svelte文件。要使Sirv返回带有CORS头的请求，可以使用标志-c，只需要将其添加到package.json中的start脚本中。

{
...
"scripts": {
...
"start": "sirv public --no-clear -c"
},
}