vue前后端跨域解决

在前端配置前端代理

• 步骤一：在config文件夹下的index.js文件中配置如下

    //设置前端代理
    proxyTable: {
      '/api': {//  /api用于和根路径baseURL进行匹配
        target: 'http://127.0.0.1:3000',//改成后端的地址，域名+端口号
        changeOrigin: true,//是否允许跨域
        pathRewrite: {   // 路径重写
          '^/api': '/' // 替换target中的请求地址，原请求为 http://127.0.0.1:8000/kuayu 实际请求为 http://127.0.0.1:8000/proxy_url/kuayu  
        }
      }
    }

• 步骤二：在main.js中配置如下

axios.defaults.baseURL = "/api" //设置默认的为/api就好了，每次请求接口都会在前面拼接上
axios.create({ 
    baseURL: "/api"   //这里也是一样的效果
  })

•  步骤三：在页面中发起请求

        login() {
            this.$axios.get('/users').then((response) => {
                console.log(response.data,"请求成功")
            })
        }

请求成功