Svelte（不是Sveltekit）添加CORS“允许来源...”在客户端HTTP标头中

Question

因此，我一直存在错误：

访问'http：// localhost：8000/＆lt; ...＆gt;'从原点'http：// localhost：8080'被CORS策略阻止：在请求的资源上没有“访问控制”标题。如果不透明的响应满足您的需求，请将请求模式设置为“无库”，以通过禁用CORS来获取资源。

我想知道如何在Svelte网站的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)

那么，我可以在哪里设置？

Answer 1

Cors与Svelte无关。服务器必须允许从另一个来源而不是客户端访问。因此，无论使用什么服务http：// localhost：8000必须设置标题。如何完成操作取决于服务器的类型。

可以从reque下载的示例使用 sirv-cli 预览编译的Svelte文件。要使用CORS标头进行SIRV返回请求，可以使用FLAG -c，仅需要添加到start> start script中的package.json 。

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