记录vue项目访问后端接口报403的问题

**记录下我坎坷的心理路程…希望对有缘者有所帮助，也对自己有个警醒。**之前一直用的vue2开发的项目，后端用的springBoot。现在项目升级，前端改用vue3.0+typeScript，后端还用springBoot，多加了个微服务。然后前端底层框架都搭建完准备调用接口时候，在登录处就卡住了。一开始报错403，是跨域的问题，然后经过配置vue.config.js文件。解决了跨域的报错问题。但是

不吃香菜的小斌

17486人浏览 · 2021-08-06 15:56:42

不吃香菜的小斌 · 2021-08-06 15:56:42 发布

记录下我坎坷的心理路程…希望对有缘者有所帮助，也对自己有个警醒。

**
之前一直用的vue2开发的项目，后端用的springBoot。
现在项目升级，前端改用vue3.0+typeScript，后端还用springBoot，多加了个微服务。

然后前端底层框架都搭建完准备调用接口时候，在登录处就卡住了。一开始报错403，是跨域的问题，然后经过配置vue.config.js文件。解决了跨域的报错问题。
但是跨域是不报了。这回是直接报403。在没有别的额外提示了。

先在网上各种查资料，有说后端问题的，有说没配置代理的等等一系列问题。这些我都做了，还是报错。
最终在第二天，前后端一起研究，找了一天原因，均无果后。为了死马当做活马医，用vue2的项目去调用vue3项目的后端接口。发现接口能通。然后麻木的顺手改了一下请求头改成如下方式。
config.headers[‘Content-Type’] = ‘text/plain’

然后奇迹发生了，接口竟然通了。
之前在网上查资料，也有说让改请求头的，但是网上提供的修改的请求头都是
application/json;charset=utf-8或者application/x-www-form-urlencoded等等，唯独没试过’text/plain’。

我让’text/plain’这几个代码卡了我整整二天时间。纯纯的血亏啊。至于为什么是因为他导致的403，才疏学浅的我还不是很清楚，如果有明白的大牛，可以给解释一下。让我也可以学习学习。

// http request 请求拦截器
instance.interceptors.request.use(
  config => {
    config.headers['Content-Type'] = 'text/plain'
    return config
  }, err => {
    return Promise.reject(err)
  }
)