uniapp發布到微信小程序整改摘要

uniapp作為跨端的利器，可同時發布到安卓、ios、微信小程序、支付寶小程序、百度小程序、頭條小程序、QQ小程序等8個平台。

如果是輕量級的應用，不涉及太多功能的話，或許可以直接打包移植，但涉及前后端各類交互多的項目，則需要注意很多的地方。

移植到各類平台，首先要避開那些在某平台上不生效或有差異的API，這時候可以用條件編譯的方式，同時也要配置在該平台專屬的一些參數，了解該平台的一些限制。

想做好跨端，建議先閱讀下官方的一些指導：

條件編譯及各端注意事項：https://uniapp.dcloud.io/platform

 

以下為app做好后移植一版微信小程序時的注意事項：

1、作用權限

如果用到了獲取當前位置的API，需要在manifest.json中找到mp-weixin代碼塊，添加如下代碼：

"permission": {
   "scope.userLocation": {
     "desc": "你的位置信息將用於小程序位置接口的效果展示" // 高速公路行駛持續后台定位
   }
}

2、資源遠程

另外微信小程序對代碼包有大小限制，貌似才2M，這時候你不得不把圖片等靜態資源放到服務器上以減少體量，也可以使用分包化解，但剛接觸分包這一塊還是比較繁瑣的。

對於圖片采取服務器路徑的形式，這里注意一下，使用  :src="$imgSrc + 'home/bg.png'"  這種域名拼接某張圖片的形式編譯到微信小程序開發工具可能是不行的，可以考慮用如下方式：

//main.js中掛載方法
//獲取圖片路徑
Vue.prototype.getImgSrc = function(src){
    return "http://www.服務器域名/" + src;
}

//在vue文件中使用方式如下
<image mode="widthFix" :src="getImgSrc('home/home.png')"></image>

 

3、權限

　　 對於一些授權相關的，需要用按鈕的開放能力來保證能夠在用戶拒絕后重新調起，比如保存相冊和登錄這些。

　　微信小程序端的登錄，openid是需要調用后台接口返回的，這時可以條件編譯單獨處理下。

　　微信登錄這里，app端和小程序端的賬戶信息要統一的話，判斷標識應使用unionid，需要在微信開放平台把小程序主體號綁定過去。

 

4、微信支付

　　一般微信小程序端只保留微信支付，同時要注意微信小程序的支付跟app是不一樣的。

　　官網支付api已有示例：https://uniapp.dcloud.io/api/plugins/payment?id=requestpayment

　　如果報total_free或支付場景非法，或者“商戶號該產品權限未開通，請前往商戶平台>產品中心檢查后重試”，千萬不要慌，下面就是答案

　　微信小程序支付后台注意事項：package的值為“prepay_id=”+實際預支付id ，trade_type為JSAPI，另外openid也要必填，另外要在商戶號開通這個JSAPI支付通道。