【内容摘要】
前端开发中一直比较困扰的两个难点，就是h5端和小程序。因为两者既有相同点，又有不同点。今天就简单的介绍一下两者混合开发。那么混合开发的优点在哪呢？
首先第一点：小程序的审核周期以及审核流程的复杂度。相信开发过小程序的开发者都踩过其中的坑。
第二点：对于初级开发者对于小程序的开发并不是那么熟悉，需要去学习开发者文档。在摸索中开发，开发成本过大，耗时久。
【实现逻辑】
下面就简单的介绍一下小程序和h5的混合开发：核心就是我们做出一个小程序基本功能的模板，
其中微信授权登录和微信获取手机号码显得尤为重要。其次就是在小程序和h5端的互相跳转。
【具体步骤】
1.公众号跳转到小程序进行授权登录。
首先需要明白的是，小程序的授权登录是微信发起的。在这里推荐使用微信官方的高版本：jweixin-1.3.2.js。因为微信扫码也会用到。
我们在从H5端跳转到小程序进行授权登录。也就是说我们需要点击事件的实现。具体点击事件加在哪里，根据实际情况而定。这里会出现环境的判断，是否为小程序环境。因为授权登录毕竟是要在小程序端实现的。下面看代码：
jumpProgram:function(e){ //jumpProgram：点击事件的名称
var that=e.data.context;
console.log('跳转小程序');
if(that.isMiniProgram){ //isMiniProgram：判断是否为小程序环境
that.wx.miniProgram.redirectTo({ //miniProgram：跳转函数
url: '/pages/alert/alert'
})
}
}，
备注：这里微信会进行一次身份验证。也就是wx变量的引入
wx.config({
debug:this.ops.info.debug,
appId:this.ops.info.appId,
timestamp:this.ops.info.timestamp,
nonceStr:this.ops.info.nonceStr,
signature:this.ops.info.signature,
jsApiList:this.ops.info.jsApiList
});
//小程序的跳转函数
MiniProgram:function(){
return (navigator.userAgent.match(/micromessenger/i) && navigator.userAgent.match(/miniprogram/i)) || window.__wxjs_environment === 'miniprogram';
},具体的要跳转的小程序路径是自己定义的。应为小程序模板的授权是在alert页面的。所以我就是这么来定义的。这样就实现了从h5端跳转到小程序。
2.小程序跳转：
首先需要了解小程序的场景值变量：scene。它可以获取到小程序当前的页面和具体的参数。
我们可以拿到需要的参数进行具体的操作。还需要进行一步重要的操作就是模拟扫码登录
这种跳转我是放在当审核版本号不相等的时候。因为什么审核的时候没有必要：
if(options && options.type === 'index' && options.fake_id && app.globalData.agent_id==99101){
url = app.URL + 'weichat_enter_4_app_wholefarm?fake_id=' + options.fake_id + '&empower_code=5678'
}
//globalData.agent_id：我们定义的全局变量，也就是从scene拿到的变量，因为这个变量后续会进行一系列的模拟扫码操作
else if (options && options.type === 'index' && options.fake_id && !app.globalData.agent_id){
console.log(123)
url = app.URL + 'weichat_enter_4_app_wholefarm?fake_id=' + options.fake_id + '&empower_code=5678'
}
else if(options && options.type === 'index' && options.fake_id && app.globalData.agent_id !==99101){
console.log(456);
url = app.URL + 'weichat_enter_4_app_wholefarm?fake_id=' + options.fake_id + '&empower_code=5678'+'&jump_type=701'+'&new_page=400_application_4_process.html'+'&new_page_para=id_public_goods_order_record-_-'+app.globalData.agent_id+'&id_public_agent_info=99101'
}else {
url = app.URL + '004_mobile_web_site_lishui_auto/front_page_index.html';
}
//此处为跳转到中。
3.快速审核机制
首先需要明白，我们提交的版本。是提供给什么人员查看的，所以是我们在编写静态页面就已经准备好的数据。我们需要定义一个全局变量。决定版本的全局变量。我们在加载一个后端返回给我们的变量。如何两者相等，就是我们准备好给审核人员查看的版本。要记得，当我们提交完代码审核之后，我们的小程序代码是不能改动的，所以后端在将版本号修改一下，两者版本号不相等，我们就可以拿到动态数据了。之后具体的页面跳转，就要根据实际项目需要，进行实际跳转。
if (parseInt(data.shenhe_banben.version_name) === app.DATA.version)
