今天接了一个新的需求,需要在小程序内打开一个h5界面进行授权,之后再返回信息。
测试了官方文档wx.miniProgram.postMessage
没有效果后,想了个折中的办法。
web-view =》打开页面 =》进行授权 =》页面内部自己跳转 =》跳转小程序某个承接页。
实际上是使用了wx.miniProgram.navigateTo({url: '/path/to/page'})
方法,让后端在h5页面跳回小程序时跳到一个特定页面,将参数拼接在页面后缀,这才实现了传输信息。
- web-view代码:
<web-view src="{{url}}"></web-view>
onLoad: function (options) {
let _this = this;
wx.request({
url: 'xxx/weiXin/returnUrl', //仅为示例,并非真实的接口地址
header: {
'content-type': 'application/json' // 默认值
},
success(res) {
let url = 'https://xxxx&state=redirect&sUrl=' + res.data
_this.setData({
url: encodeURI(url)
})
console.log(encodeURI)
},
fail(res) {
console.log(res)
}
})
}
- h5页面
wx.miniProgram.navigateTo({url: '/pages/index/login'+ data });
- 承接页面
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
this.getUserInfo(options)
},
/**
* 获取用户信息
* @pamars 用户信息
*/
getUserInfo(options) {
let _this = this;
let userInfo = options;
app.setUser(userInfo);
wx.reLaunch({
url: '/pages/index/index'
})
}