微信小程序嵌入Jquery Mobile网页
之前用Jquery Mobile开发了微信公众号，业务逻辑都开发完成，支付和分享功能都还不错，但网页的安全还是不太令人满意。 用户只要复制链接（url）到电脑的浏览器上，查看网页元素，网页HTML和JS代码都暴露了， 辛辛苦苦的设计大白于天下；如果遇到黑客稍加修改，服务器数据就可能被抓取或被破坏，数据安全受到严重威胁。
微信小程序web-view的出现，很好解决上述弊端。把Jquery Mobile开发的网页url赋值到web-view的src属性即可，用户看不到url，也没法复制url， 也看不到页面HTML和JS代码。 而且随着网络速度加快， Jquery Mobile页面在微信小程序的速度表现不逊色于原生小程序。把小程序分享到桌面就与原生APP差不多，免去开发原生APP的重复工作，还适用于Android，苹果，鸿蒙，确实是事半功倍。
（1）小程序web-view设置url
<!-- wxml -->
<web-view src="{{url}}" ></web-view>//js:
this.setData({
url: 'https://xxx.com/mobile/index.html?openid=xxxx'
});（2）分享功能代码片段：
//jquer-mobile页面 JS调用小程序分享页面：
wx.miniProgram.navigateTo({ url: '../share/share?title=xxx&img=xxx'});<!-- 小程序wxml代码： -->
<button open-type='share' >分享</button>（3）支付功能代码片段：
//jquer-mobile页面 JS调用小程序支付页面：
wx.miniProgram.navigateTo({ url: '../pay/pay?timestamp=xxxx&nonceStr=xxx&prepay_id=xxx&paySign='});//小程序支付页面JS代码：
wx.requestPayment({
'timeStamp': unescape(option.timeStamp),
'nonceStr': unescape(option.nonceStr),
'package': 'prepay_id=' + unescape(option.package),
'signType': 'MD5',
'paySign': unescape(option.paySign),
'success': function(res) {
ths.setData({
vPayStaturs: "微信支付成功！正返回订单..."
})
console.log(res);
ths.returnWeb2('success');
},
'fail': function(res) {
ths.setData({
vPayStaturs: "微信支付失败！" + res.errMsg
})
console.log(res);
},
complete: function(res) {
// complete
console.log(res);
}
});（4）联系客服
//jquer-mobile页面 JS调用小程序联系客服页面：
wx.miniProgram.navigateTo({ url: '../contact/contact?aa=xxx'}); <!-- 小程序wxml代码： -->
<button open-type="contact" bindcontact="handleContact" >联系客服</button>（5）小程序授权页面
<!-- 小程序wxml代码： -->
<!-- 需要使用 button 来授权登录 -->
<button wx:if="{{canIUse}}" open-type="getUserInfo" bindgetuserinfo="bindGetUserInfo">授权登录</button>
<view wx:else>请升级微信版本</view>//小程序js：
bindGetUserInfo: function(e) {
getApp().globalData.userRes = e.detail;
wx.navigateTo({
url: '../index/index?isAuthSuccess=1'
})
}
//小程序js： 授权并登录后获得openid
wx.request({
url: 'https://xxx.com/ajax.ashx?isminiprog=1',
data: {
weixinCode: that.loginCode,
encryptedData: userRes.encryptedData,
iv: userRes.iv,
Type: 'wx_getopenid'
},
header: {
"Content-Type": "application/x-www-form-urlencoded"
},
method: 'POST',
//服务端的回掉
success: function(result) {
that.openid = that.GetValueFromNV(result.data, "openid");
},
fail: function(rlt) {
console.log(rlt)
}
})