Vue3中设置Content-Type失效的问题

想向大家请问一下为什么我后端一直报这个错误

我的办法是，因为用了@RequestBody，所以前端应该是用json格式发过来，所以我在前端改了

但是还是不行，一直显示是这个

真不知道咋办了，为啥我修改了请求的headers还是不会变呢？谢谢大家！

设置 token 的时候 把headers 给全部重置了，

看下调用的 request 方法是怎么封装的，是不是设置了全局的 header

【以下回答由 GPT 生成】

解答

这个问题可能是由于Vue的版本使用了Vue3导致的，Vue3中axios默认的请求头'Content-Type'不再是'application/json'。

解决这个问题的方法是手动设置axios的请求头的'Content-Type'为'application/json'。

首先，在Vue项目中安装axios，使用以下命令：

npm install axios

然后，在需要发送请求的地方引入axios，并手动设置'Content-Type'为'application/json'，示例如下：

// 引入axios
import axios from 'axios';

// 设置axios的默认请求头
axios.defaults.headers.common['Content-Type'] = 'application/json';

这样就能保证每次请求的'Content-Type'都是'application/json'了。

如果你的代码已经按照上述方式进行设置，但仍然无效，可以考虑将请求数据转换为JSON字符串，然后使用axios.post或axios.put等方法发送请求，示例如下：

// 请求数据
const data = {
  // 请求数据内容
};

// 将请求数据转换为JSON字符串
const jsonData = JSON.stringify(data);

// 发送POST请求
axios.post('/api', jsonData);

// 或发送PUT请求
axios.put('/api', jsonData);

这样设置后，应该能解决你的问题。如果以上方法仍然无效，请提供更多相关代码和错误信息以便更好地解决问题。

【相关推荐】

• 这篇博客: Vue3实战总结（二)中的 请求头拦截，Request Header添加参数 部分也许能够解决你的问题。