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支付通道。