需求背景
我们在高德中有自己产品的小程序,然后要在高德中做个h5页面,点击这个页面中的按钮时,进入我们的小程序的首页和充值页面
开发,正常开发h5页面,主要是在页面中点击按钮的调起事件
if (window.AlipayJSBridge) {
this.aliSDK(pageName)
} else {
// 如果没有注入则监听注入的事件
document.addEventListener( 'AlipayJSBridgeReady', this.aliSDK(pageName), false)
}
aliSDK (page) {
AlipayJSBridge.call('startApp', {
appId: '2021001108603294',
param: {
page: page
}
}, res => {
// noop
console.log('aliSDKsuccess', res)
})
},
AlipayJSBridge是支付宝客户端通过bridge机制,允许前端H5页面通过特定的JS方法
AlipayJSBridge不需要任何的引用,是支付宝在window.load后直接存在的,我们直接使用即可,但是因为是异步,所以需要我们判断一下
联调
因为我们做完了需要调试,但是我们没有权限把我们的h5页面放在高德中,所以需要我们做一些处理
'amapuri://applets/platformapi/startapp?appId=20000067&url=%2Fpages%2FmyAccount%2FmyAccount'
appId为固定,url之后拼接的是你自己的h5页面url,但是url需要encode,然后再把这个连接生成一个二维码,然后用你的高德app去扫码,然后就可以出来你的h5页面,这个时候就可以通过你的按钮去测试是否可以调起了
网友评论