【这是前提】前端框架支撑路由功能,比如我这里是通过vue的构建的页面,可以$route获取链接 然后通过postMessage()和小程序对接。详情见:https://developers.weixin.qq.com/miniprogram/dev/component/web-view.html?search-key=postMessage 比如我这边是注册一个全局路由钩子进行拦截处理,让每次跳到新页面,给小程序发送页面当前链接 [代码]// 全局路由[代码][代码]router.beforeEach((to, from, next) => {[代码][代码] [代码][代码]console.log([代码][代码]'to:'[代码][代码], to, [代码][代码]'from:'[代码][代码], from)[代码][代码] [代码][代码]// fix: ios小程序分享无法获得分享链接问题[代码][代码] [代码][代码]// !!!注意点: 通过location.href无法获取当前最新页面链接地址[代码][代码] [代码][代码]var[代码] [代码]path = to.fullPath;[代码][代码] [代码][代码]var[代码] [代码]href = location.origin + location.pathname + [代码][代码]'#'[代码] [代码]+ to.fullPath;[代码][代码] [代码][代码]console.log([代码][代码]'向小程序发送当前页面链接信息'[代码][代码], href);[代码][代码] [代码][代码]wx.miniProgram.postMessage({ data: { url: href} })[代码][代码] [代码][代码]next();[代码][代码]})[代码] 小程序接收的信息是一个数组,每次发送的信息都加到数组,所以获取最后一个数组项即是当前的地址。 [代码]// 接收内嵌h5发送过来当前页面的链接地址[代码] [代码]postMessage(e) {[代码] [代码] [代码][代码]let l = e.detail.data.length - 1;[代码] [代码] [代码][代码]this[代码][代码].data.shareUrl = e.detail.data[l].url;[代码] [代码] [代码][代码]console.log([代码][代码]'webview页面发送过来的数据:'[代码][代码], e);[代码] [代码]}[代码]这里也有个条件,也刚好撞上:就是 postMessage发送的数据不会立即执行,需要触发(后退、组件销毁、分享)相关操作才能收到消息,这里刚好需要触发分享操作才能拿到数据。 希望对大家有点帮助。
web-view分享时ios下webViewUrl参数丢失[图片] [图片] 点击分享时。ios下的webViewUrl中锚点#后面的参数获取不到。安卓才可以获取完整的 很急,在线等解决
2018-10-26