问题描述

项目打包部署到测试服务器上之后,axios访问路径一直不对,本地用的proxyTable代理解决的跨域问题。
请求路径应该是“http://xxx.xxx.xx.xx:8080/zlhj_interface/rateScreen/queryProAndCity”,但是部署到测试服务器上之后多出下图框选的路径“zlhj/app/carAuth”(dist文件放在这个carAuth文件夹下)。

报错截图

在这里插入图片描述

解决方案

步骤一:在config/prod.env.js中,新增:

// Test server domain name
API_HOST:'"http://xxx.xxx.xx.xx:8080"'
// An highlighted block
'use strict'
module.exports = {
  NODE_ENV: '"production"',
  API_HOST:'"http://xxx.xxx.xx.xx:8080"'
}

步骤二:在config/dev.env.js中,新增:

API_HOST:'"/api/"'
// An highlighted block
'use strict'
const merge = require('webpack-merge')
const prodEnv = require('./prod.env')

module.exports = merge(prodEnv, {
  NODE_ENV: '"development"',
  API_HOST:'"/api/"'
})

步骤三:在main.js中(我封装了axios在request.js)设置:

request.defaults.baseURL = process.env.API_HOST;
// An highlighted block
/** global config */
request.defaults.baseURL = process.env.API_HOST;
request.defaults.headers.post['Content-Type'] = 'application/json';
request.defaults.timeout = 30000;
request.defaults.withCredentials = true;//Send cross-domain request credentials

注意点:

设置API_HOST的时候,必须加上单引号‘ ’跟双引号“ ”

// An highlighted block
'use strict'
module.exports = {
  NODE_ENV: '"production"',
  API_HOST:'"http://xxx.xxx.xx.xx:8080"'
}

Logo

前往低代码交流专区

更多推荐