HTTP POST 重定向在 SvelteKit 中不起作用

Question

在 SvelteKit 中，我想处理发布请求并在成功时重定向到路线。这应该可以通过发送状态代码 303 和位置标头来实现 - 如SvelteKit 文档中所示。不幸的是，它不起作用。在开发工具中，您会看到 303 响应，但未处理重定向。当然，有解决方法（例如，在客户端重定向，或直接发布到所需页面），但我想知道为什么会发生此错误。

Stackblitz：https://stackblitz.com/edit/sveltejs-kit-template-default-z9rs2c

index.svelte

 <script>
   function submit() {
     fetch("/endpoint", {method: "POST"});
   }
 </script>

 <button on:click={submit}>Click me</button>

端点.js

export function post() {
    console.log('got post request at endpoint');
    return {
        status: 303,
        headers: {
            location: '/success'
        }
    };
 }

成功.svelte

 <h2>Success</h2>

Answer 1

仅当您使用本机

<form method=POST>

HTML 构造时，Web 浏览器才会处理 HTTP POST 重定向。

您正在使用

fetch()

API，这是非常不同的。因此您需要自己处理重定向。

您可以通过从

location

响应标头中提取

fetch()

，然后从

$app/navigation

手动调用 goto() 来实现此目的。

Answer 2

未来参考这可以通过 307/308 状态代码响应和 Location 标头来处理。由于大多数浏览器实现了 301/302 来更改为获取请求 307/308，我们需要纠正而不是更改请求类型/模式。