vue打包移动app的测试环境与生产环境地址问题

1 篇文章 0 订阅
1 篇文章 0 订阅

我在vue移动app开发中遇到了这样一个问题——在打包后打开app,点击登录无法连接到服务器,甚至连请求都没能发出去。
确认了下,首先手机和电脑连接的是同一wifi且能ping通。排除了网络问题的可能性。
后来发现了这样一个坑爹的问题

dev: {

    // Paths
    assetsSubDirectory: 'static',
    assetsPublicPath: '/',
    proxyTable: {
      '/SSMTWO': {
        target: '', //域名
        secure: false,
        changeOrigin: true,
        pathRewrite: {
          '': ''
        }
      }
    },

这里地址我去掉了。这里是配置跨域,然而在生产环境中移动app是根本不能够进行跨域的!(使用Nginx进行配置跳转除外)。
那么,如何进行生产环境配置呢?
我们可以注意到,在index.js上下个又一个js配置文件,分别是dev.env.js和prod.env.js,这里我们在prod.env.js,也就是生产环境的module中添加代码后如下:

'use strict'
module.exports = {
	  NODE_ENV: '"production"',
	  BASE_URL: '"这里填你的服务器地址"',
}

配置完成后,需要在调用的地址设置其baseurl,我使用的是axios,在main.js里进行全局注册时,对其进行设置,添加后代码如下:

Vue.use(ElementUI);
axios.defaults.baseURL = process.env.BASE_URL
Vue.prototype.$axios = axios;

此时在运行npm run build打包后再打包成apk,测试没有问题了。

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值