微信分享功能实现,兼容安卓和IOS

微信分享注意事项

  • 生成签名的路径必须是当前页面的路径
  • 分享的url不能含有特殊符号,例如# (所以vue-cli项目路由要用history模式history模式配置
  • ios分享图标不能超过32K
  • link参数带中文或者特殊字符,带中文的url在安卓中应该也是会出问题的,但是安卓会自动encodeURIComponent(),而ios不会。所以如果url参数中带了中文字符,将参数encodeURIComponent()编码,再提交代码,ios可以正常分享。

iOS下vue项目 微信签名出错
用SPA做微信h5,调用微信jssdk的页面,安卓微信上木有问题,ios微信报当前url未注册。经过调试,是ios微信版本问题导致页面跳转url未变化,导致验签失败。所以我们大致的思想就是:在ios微信环境中,如果跳转页面与当前页面的url不一致,那么就重载刷新整个跳转页面。因为项目使用vue,所以我们使用vue-router的钩子函数beforeRouterEnter()来做此操作,将钩子函数写入js模块,使用时候混入页面vue实例选项即可

// 修复IOS版微信h5 history兼容性问题(b页面需要分享,在路由beforeRouterEnter方法里强制刷新b页面)
if (isIOSEnv() && from.path.indexOf('/a') >=0 && to.path.indexOf('/b') >=0) {
	 // location.assign 会导致路由错乱, 返回上一页会出问题
	 // location.assign(util.baseUrl + '/b')
	 location.replace(util.baseUrl + '/b')
}

js判断浏览器环境

let isIOSEnv = function () {
  return /(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)
}
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值