记录解决报错--vue前后端分离，接口401(Unauthorized)

本文主要是介绍记录解决报错--vue前后端分离，接口401(Unauthorized)，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

1.场景

前端访问不了后端接口。报错401。

2.解决步骤

①在页面console.log(111)查看走到代码的位置没有。（走到了，没问题）
②查看vue.config.js配置。这段配置就是vue访问api的url。（没问题）

devServer: {port: 8011,//前端端口//代理，例如前端访问http://127.0.0.1:8011/xxx//实际访问后端接口http://VUE_APP_URL/xxx//如VUE_APP_URL=127.0.0.1:9000,实际访问就是http://127.0.0.1:9000/xxxproxy: {"/xxx": {//后端接口统一前缀target: process.env.VUE_APP_URL,//后端接口urlchangeOrigin: true,//允许跨域，改变ip和端口传给后端// pathRewrite: {//   "^/api": "",// },},},},

查看.env.development配置，VUE_APP_URL = ‘http://127.0.0.1:9000’。（没问题）
③查看gateway实际访问接口，http://127.0.0.1:9000/xxx。（没问题）
④我接口认证的ip是192.168.101.29，vue前端页面访问的是http://localhost:8011，认证成功后，认证信息保留在192.168.101.29里面，所以localhost里面没有认证信息，所以认证完后访问接口还是401错误。于是，将vue前端页面访问ip改为局域网的http://192.168.101.29:8011。问题解决。

这篇关于记录解决报错--vue前后端分离，接口401(Unauthorized)的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---