## 一、概述 前后端分离调试的时候，通过配置，解决跨域访问问题，部署的时候，可以通过合并前后端（不存在跨域）或分离部署（nginx的跨域设定）来解决； ## 二、方案 如后端的访问接口url形式为： ``` http://localhost:8090/staff/list ```  前端调用api的方式： ``` //定义代码 import axios from 'axios' Vue.prototype.$axios = axios //使用代码 this.$axios.get('/api/staff/list', params).then(res\=> { ``` ## 三、配置 ``` proxyTable: { '/api': { target: 'http://localhost:8090', changeOrigin: true, pathRewrite: { '^/api': '/' } } }, ``` 或 ``` devServer: { // development server port 8000 port: 8000, // If you want to turn on the proxy, please remove the mockjs /src/main.jsL11 proxy: { '/api': { target: 'http://localhost:80', ws: false, changeOrigin: true } } }, ``` ``` //调用get请求 this.$axios.get('/api/staff/list', params).then(res => { this.pageLoading = false if (!res.data || !res.data.rows) return //总数赋值 this.total = res.data.total this.page++; //页面元素赋值 this.rows = res.data.rows }).catch(e =>{ this.pageLoading = false } ) ``` > 需要注意的是，get/post要与后台的get和post模式匹配起来；