vue.js 本地解决跨域

1、config/index.js下添加proxyTable

dev: {
    // Paths
    assetsSubDirectory: 'static',
    assetsPublicPath: '/',
    proxyTable:{
      "/api/*":{
        target: 'http://*.*.*.*:9502',//后端接口地址
        secure:false,
        changeOrigin:true,
        pathRewrite:{
          "^/api":""
        }
      }
    },

    // Various Dev Server settings

    // can be overwritten by process.env.HOST
    // if you want dev by ip, please set host: '0.0.0.0'
    host: '192.168.1.127',
    port: 9527, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined
    autoOpenBrowser: true,
}

  2、配置config/dev.env.js  (本地地址+api)

module.exports = {
  NODE_ENV: '"development"',
  ENV_CONFIG: '"dev"',
 // BASE_API: '"http://172.17.92.255:9502"'
  BASE_API: '"http://192.168.1.127:9527/api"'
}

  3、创建request.js请求接口

// create an axios instance
const service = axios.create({
  baseURL: process.env.BASE_API, // api 的 base_url
  timeout: 5000,// request timeout,
  headers: {
    'Content-Type': 'application/json; charset=utf-8'
  }
})

  4、实例

export function getContractList(data = {}, headData={}) {
  return request({
    url: '/cms/companyList',
    method: 'post',
    data: data,
    headers:headData
  })
}

  

你可能感兴趣的:(vue.js 本地解决跨域)