爬坑之路：使用uni-app开发H5以及开发APP过程中遇到的坑

概述

1. 前段时间评估开发新版APP使用原生+H5混合的方式开发，进行了多项评估后，发现Dcloud的uni-app比较符合我们的需求，于是开始了uni-app的爬坑之路。有熟悉uni-app的一定知道，uni-app本来就可以编译打包成为app,为什么还要用原生app套壳，不是增加负担么，其实，这是由于项目中也属需求，暂时uni-app没有办法达到目标，于是使用uni-app开发H5端，再使用原生APP交互完成，达到特定需求。
2. 开始爬坑之路以后，第一件事就是学习成本。主要学习的对象就是vue.js，本人虽然会写js，但是从来没有用vue.js写过，在我看来，用一门知识写一个完整的demo，才能算是起步。那本人属于从0开始入坑了。

爬坑之路

1. uni-app中使用vue.js遇到的坑

   1. 全局变量：由于是从0开始，所以完全不知道加载流程，所以，不清楚全局变量如何设计。幸好，这个问题是个通用问题，不少人遇到了，两种方式，一种就是公用页面，使用时引用，另一种就是直接写入main.js申明进入vue.prototype中的自定义属性，全局可以调用this.属性。参考页面：https://ask.dcloud.net.cn/article/35021
   2. 跨页面传参onload:function(option) {},其中option获取页面参数,参数中不能使用?这类特殊字符，否则参数会从这类特殊字符处断掉，需要带参数事，需要使用encodeURIComponent进行先转义
   3. html属性中使用变量的形式，v-bind:属性='变量' 或者 :属性='变量'，“:”是v-bind的缩写。“@”是v-on的缩写
   4. 需要熟悉flex布局方式

2. H5与原生app交互遇到的坑

   1. H5采用前后端分离的模式开发，H5调用接口为http协议，而原生app打开H5使用的是https协议，这样的情况，会造成H5无法进行API请求，简单理解就是https协议下，加载http协议资源会被拦截
   2. H5请求接口，始终要注意跨域问题。最简单的处理方式，就是api端使用Access-Control-Allow-Origin:*(或者指定域名),API端开放特定域名使用资源
   3. 分享过程中，如果使用到了app的原生微信分享功能，需要特别注意字段的限制，其中最常见的就是图片的限制，二进制大小32k以内