使用Zustand时Axios请求出现未捕获Promise错误（状态码300）

首先明确：300是多重选择重定向状态码，Postman会自动处理或展示可选资源，但浏览器端的Axios/Fetch不会自动跟进这种重定向，导致报错。结合你的情况，按以下步骤排查：

1. 对齐Postman与前端请求头 #

打开Postman的请求详情，复制所有请求头，在前端Axios请求里完全照搬，排除因请求头不一致导致的服务器响应差异：

loadLivespa: async () => {
  try {
    const response = await axios.get(URL1, {
      headers: {
        // 粘贴Postman里的所有请求头，示例：
        "Accept": "*/*",
        "User-Agent": "PostmanRuntime/7.36.3"
      }
    });
    set({ liveSpa: response.data });
  } catch (err) {
    console.log(err.response); // 打印完整响应信息方便排查
  }
},

2. 检查服务器CORS配置 #

Postman不受浏览器CORS限制，但前端请求会被拦截。如果服务器未配置允许前端域名（http://localhost:3000）的跨域请求，可能触发异常重定向。以Node.js为例，确保CORS配置正确：

const cors = require('cors');
// 允许前端域名跨域
app.use(cors({ origin: 'http://localhost:3000' }));
// 开发环境可临时允许所有来源（生产环境禁用）
// app.use(cors());

3. 手动处理300重定向 #

Axios默认不自动处理300重定向，可捕获错误后手动提取正确资源地址再发起请求：

loadLivespa: async () => {
  try {
    const response = await axios.get(URL1);
    set({ liveSpa: response.data });
  } catch (err) {
    if (err.response?.status === 300) {
      // 从响应头或响应体中提取正确资源地址
      const targetUrl = err.response.headers.location || err.response.data?.locations[0];
      if (targetUrl) {
        const finalRes = await axios.get(targetUrl);
        set({ liveSpa: finalRes.data });
      }
    } else {
      console.error('请求失败:', err);
    }
  }
},

4. 排查服务器路由逻辑 #

调试服务器的/livespa路由，打印请求的origin、headers等信息，确认是否因为请求来源是浏览器，服务器返回了300重定向而非数据。比如服务器可能存在针对浏览器请求的跳转逻辑，需要去掉或调整。

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