我用node .js的express框架写的登录接口，发现postman可以调通，但是vue3前端报错

vue3

我发现是我后端node.js的app.js入口文件中配置的解析前端参数的解析中间件和前端请求头中的Content-Type配置不一致的原因
解决方案
因为我后端配置解析表单数据的中间件是express.urlencoded({ extended: false }),只能解析application/ x-www-from-urlencoded 格式的表单数据

所以第一种方法修改前端，后端不变
前端修改
登录接口修改添加这2个，如果你所有接口都是这种数据解析
把 “Content-Type”: “application/x-www-form-urlencoded”, 加载请求拦截器里也行，我这里是只说登录单个接口，所以把 “Content-Type”: "application/x-www-form-urlencoded"这个单独加到了登录里面为了测试

这是我的请求拦截器和相应拦截器的配置

import axios from 'axios'

const http = axios.create({
  baseURL: 'http://localhost:5000', // 根据你的 Node 服务地址修改
  timeout: 10000,
})

// 请求拦截器
http.interceptors.request.use(config => {
  // 可以在这里添加 token 等
  const token = localStorage.getItem('token')
  if (token) {
    config.headers.Authorization = `${token}`
  }

  // 确保已有 Authorization 头不被覆盖
 // if (token && !config.headers.Authorization) {
   // config.headers.Authorization = `${token}`;
  //}
  // // 如果请求体是对象且尚未设置 Content-Type
  // if (config.data && typeof config.data === 'object' &&
  //   !config.headers['Content-Type']) {
  //   config.
  //   headers['Content-Type'] = 'application/json;charset=utf-8';
  // }
  return config
}, error => {
  return Promise.reject(error)
})

// 响应拦截器
http.interceptors.response.use(response => {
  console.log("请求成功:", response.config.url, response.data);
  // 解析JSON数据
  const data = typeof response.data === 'string' ?
    JSON.parse(response.data) :
    response.data;

  if (data.status && data.status !== 0) { // 0表示成功
    return Promise.reject(data);
  }
  return data;
}, error => {

  return Promise.reject(error)
})

export default http

结果

第二种方法修改后端的中间件，前端不变
给后端代码添加
app.js文件中添加express.json解析application/json的中间件，前端代码不变

前端代码 headers[‘Content-Type’] = ‘application/json;charset=utf-8’;可以加可以不加，因为你发送的是一个 JavaScript 对象（credentials），
axios 会自动将请求头 Content-Type 设置为 application/json
使用 JSON.stringify(credentials) 转换请求体

结果