Cordova vue-cli3 集成打包成apk以及遇到的問(wèn)題

1)總結(jié)問(wèn)題

1)一個(gè)項(xiàng)目中有2+以上的url請(qǐng)求,原因是后臺(tái)分模塊化的,導(dǎo)致前端一個(gè)項(xiàng)目中會(huì)有不同的請(qǐng)求,比如登錄是8001,里面其他的明細(xì)是8002
2)cordova 和 vue 集成打包apk后,無(wú)法訪問(wèn)后臺(tái)的接口問(wèn)題,可正常瀏覽器模擬是沒(méi)有問(wèn)題的,原因是vue的npm run build 命令,該命令打包的文件默認(rèn)不是生成環(huán)境,所以在封裝BASE_URL(統(tǒng)稱后臺(tái)地址)時(shí),注意路徑問(wèn)題和vue3跨域以及在android里的AndroidManifest.xml 添加 android:hardwareAccelerated="true"
3)cordova 項(xiàng)目 和 vue的項(xiàng)目同層級(jí)
4)簡(jiǎn)單露出代碼,如不懂可留言咨詢,博主一定會(huì)回答

//vue3跨域
  proxy: {
             '/mes': {
                target:'http://10.4.12.248:8000/mes',
                ngeOrigin: true,
                ws: true,
                pathRewrite: {
                  '^/mes': ''
                }
              },
              '/wms': {
                target:'http://10.4.12.248:8001/wms',
               ngeOrigin: true,
                ws: true,
                pathRewrite: {
                  '^/wms': ''
                }
              }
            }
//cordova 結(jié)合 vue3 配置,跟vue項(xiàng)目同層級(jí)
         publicPath:'./',
         outputDir:'../cordovademo/www',
         productionSourceMap:false,
//-----------------------------------------
//main.js 中 引入 cordova
import VueCordova from 'vue-cordova'

Vue.use(VueCordova)


// add cordova.js only if serving the app through file://
if (window.location.protocol === 'file:' || window.location.port === '8888') {
  var cordovaScript = document.createElement('script')
  cordovaScript.setAttribute('type', 'text/javascript')
  cordovaScript.setAttribute('src', 'cordova.js')
  document.body.appendChild(cordovaScript)
}
//測(cè)試的
Vue.cordova.on('deviceready', () => {
  console.log('Cordova : device is ready !');
  console.log('Vue.cordova :', Vue.cordova);
});
//2+ 以上的url地址請(qǐng)求封裝 創(chuàng)建axiosInit.js 封裝請(qǐng)求的地址 我的目錄放在了src 下面的utils文件夾下
import axios from 'axios';

let mes_url='';
let wms_url='';


if (process.env.NODE_ENV === "development") {
    //'/api'為vue.config.js中設(shè)置的proxy代理
    mes_url='/mes'; 
    wms_url='/wms'; 
}else {
    mes_url='http://10.4.12.248:8000/mes';
    wms_url='http://10.4.12.248:8001/wms'
}

const mes_req=axios.create({
    baseURL:mes_url,
    timeout:60000    //1m
});

const wms_req=axios.create({
    baseURL:wms_url,
    timeout:60000   //1m
});

//請(qǐng)求、響應(yīng)攔截 

/*mes_req.interceptors.request.use(function(req){
    alert(req.url)
    if(req.url.includes('127.0.0.1')||req.url.includes('localhost')){
        alert(1)
    }else{
        alert(2)
    }
  return req;
});*/

/*wms_req.interceptors.request.use(function(req){
    alert(wms_url)
    alert(req.url)
  return req;
});
*/

const service={
    mes_req,wms_req
}

export default service;

//-----------------------------------------
//main.js 中引入
import axiosInit from './utils/axiosInit'
Vue.prototype.mes_req=axiosInit.mes_req;
Vue.prototype.wms_req=axiosInit.wms_req;

//-----------------------------------------
//實(shí)例請(qǐng)求 登錄 和 其他明細(xì)
  methods:{
    async login(){
      this.wms_req({
        method:'post',
        url:'/login',
        data:{
            userName:this.username,
            passWord:this.password
        }
      }).then(res=>{
       const {code,data,message} = res.data;
       if(code==='200'){
         this.$toast.success(message);
         localStorage.setItem('token',data.token);
         localStorage.setItem('user',data.userInfo); 
         //this.$router.push('/tabbarPage');
         this.$router.push('/home');
       }else{
          this.$toast.fail(message)
       }
      }).catch(err=>{
          alert(err);
      }) ;
    }
  }

 getAllWoTask(){
                
                this.mes_req({
                  method:'post',
                  url:'/wo/list',
                  header:{
                          'Content-Type':'application/json'  //如果寫成contentType會(huì)報(bào)錯(cuò)
                      },
                  data: this.prams
                }).then(res=>{
                const {code,data} = res.data;
                 if(code==='200'){
                     console.log()
                     this.list=[...this.list,...data.list];
                     this.totalNum=this.totalNum+data.list.length;
                    
                    //每一次加載完設(shè)置false,便于下次繼續(xù)加載
                    this.loading=false;
                    this.refreshing = false;
                    this.isSearch=false;
                    //判斷是否還有數(shù)據(jù)加載
                    if(data.length<this.prams.size){
                        this.finished=true;
                    }
                    
                    
                 }else{
                    this.$toast.fail(message)
                 }
                });
            }
結(jié)束了,你們還有什么問(wèn)題?

希望此教程可以幫助到你們。???

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容