前端环境部署如何配置后端接口地址【超级详细的方法步骤】

后台访问地址

前端访问后台地址其实是需要区分本地开发和服务器部署。

本地开发访问:

本地开发是开发环境,因为本地启动项目,开发环境可以通过接口代理的方式解决跨域相关问题,所以我们配置访问地址的时候会比较简单。

前端为了统一处理接口访问,会设置baseUrl,这里的bms是应用地址前缀。

// 路径地址:src/services/baseUrl.js

// eslint-disable-next-line import/no-mutable-exports
let baseUrl = '/api/bms';

export default baseUrl;
复制代码

代理配置文件

// 路径地址: config/config.js

proxy: {
  '/api/bms': {
    target: 'http://xxxxx:8000/', 
    changeOrigin: true,
    pathRewrite: { '^/api/bms': '/' },
  },
},
复制代码

这里的**/api/bms对应的是baseUrl.js的baseUrl。访问地址的时候:接口访问的是 /api/bms/interface*。通过代理会变成 http://xxxxx:8000/interface 这里可能会问,api/bms去哪里了。因为这行代码:

pathRewrite: { '^/api/bms': '/' },
复制代码

会将 /api/bms 通过代理变成 /

上一篇:HIL台架原理介绍


下一篇:DL:深度学习算法(神经网络模型集合)概览之《THE NEURAL NETWORK ZOO》的中文解释和感悟(三)