使用Express res.redirect后出现未捕获错误，注册重定向首页失败

错误原因 #

前端通过fetch发送请求时，默认期望后端返回JSON格式数据，但后端直接调用res.redirect()返回302重定向响应，最终前端接收到的是首页的HTML代码（以<!DOCTYPE开头），代码尝试将HTML解析为JSON，从而触发语法错误。

解决方案 #

1. 修改后端逻辑：返回JSON响应而非直接重定向 #

后端专注处理业务逻辑（比如完成自动登录的session/JWT生成），返回注册成功的状态信息，交给前端处理跳转：

// BACKEND registerController.ts
// 先执行自动登录相关逻辑
res.status(200).json({ success: true, message: "注册并登录成功" });

2. 前端接收响应后手动跳转 #

在前端请求成功后，解析JSON响应，通过window.location完成页面跳转：

// FRONTEND apiHandler.ts
const init = {
    method,
    headers: { 'Content-Type': 'application/json' },
    body: JSON.stringify(body)
};

const response = await fetch(`http://localhost:4000/api${endpoint}`, init);
if (!response.ok) throw new Error("注册请求失败");

const data = await response.json();
if (data.success) {
    window.location.href = 'http://localhost:3000/';
}

补充说明 #

前后端分离架构中，后端核心职责是处理业务并返回数据，页面跳转属于前端行为，由前端控制更符合架构约定，也能避免这类格式不匹配的错误。

内容的提问来源于stack exchange，提问作者sanaaa