一旦 api 调用返回并显示 http 代码 500，Svelte 就会抛出错误

Question

我知道这种行为可能是件好事，但我将错误消息写入了 Json 响应中。它看起来如下所示：

{
    "message": "There was a problem processing the input",
    "code": 500,
    "status": "INTERNAL_SERVER_ERROR",
    "timestamp": "2024-04-21T00:31:17.6652992" 
}

我的目标是在发生错误时显示“消息”，但是 svelte 一旦看到代码 500 就会中断一切。

这是我目前的 Svelte 代码：

errorHeader = 'Editing User....';
errorMessage = '';
let status;

        return await fetch('http://localhost:8080/Manage-User', {
                method: 'PUT',
                body: JSON.stringify(mainBody),
                headers: {
                    'Content-Type': 'application/json',
                }
            }).then(response =>{console.log(response);
                 status = response.status;
                 return response.json
                }).then(result => {if(status>=200 && status<300){
                errorHeader = "Success"
            }
        else if(status<=200 && status>300) {
            errorHeader = "An error occured while editing the user";
            errorMessage = result.message;
        }})
      
    }

当尝试输入错误的内容时，我在浏览器控制台中收到以下错误消息：

PUT http://localhost:8080/Manage-User 500 (Internal Server Error)
window.fetch    @   fetcher.js?v=e8991498:62
saveUser    @   +page.svelte:155

有什么方法可以防止这个错误或者有更好的方法吗？

我已经尝试添加

).catch(error => (...))

。但这部分代码无法访问响应中的消息。

Answer 1

从

fetch()

返回的 Promise 仅在与服务器通信失败时才会拒绝，因此，如果

fetch()

导致

500

响应状态代码，则 Promise 仍会解析，因此使用

.catch()

不会对您有帮助在这种情况下。但是，您应该使用：

• response.json()

  ，而不是

  response.json

• response.status

  ，而不是

  status

而且您只处理案件

status>=200 && status<300

，因此当您收到

500

回复时，您不能指望会发生任何事情。