vue代理服务器proxy配置

标签：cli   开启   create   rewrite   代理服务   根目录   axios   localhost   targe   

1.如果没有vue脚手架需先要安装脚手架

cnpm i @vue/cli -g

2.利用脚手架创建项目

vue create myproject（项目名）

3.创建完项目后，需手动在项目根目录创建vue.config.js

# vue.config.js
module.exports = {
  devServer: {
    host: ‘localhost‘,
    port: 8080,
    proxy: {
      ‘/api‘: {
        target: ‘http://localhost:3000‘,// 要跨域的域名
        changeOrigin: true, // 是否开启跨域
      },
      ‘/get‘: {
        target: ‘http://localhost:3000‘,// 要跨域的域名
        changeOrigin: true, // 是否开启跨域
        pathRewrite: {
          ‘^/api‘: ‘/api‘   // 这种接口配置出来     http://XX.XX.XX.XX:8083/api/login
          //‘^/api‘: ‘/‘ 这种接口配置出来     http://XX.XX.XX.XX:8083/login
      }
    }
  }
}

4.在请求跨域接口的时候就可以利用本地服务加上要跨域的接口地址即可

例如我的本地服务端口 localhost:8080

axios.get(‘http://localhost:8080/api/login‘)

vue代理服务器proxy配置

标签：cli   开启   create   rewrite   代理服务   根目录   axios   localhost   targe   

原文地址：https://www.cnblogs.com/greemmao/p/14315119.html