vue单页hash模式在微信公众号分享链接,微信支付问题

在微信公众号中,如果使用vue开发单页应用,对接了微信授权等,那么分享(朋友圈等)需要满足常规以下条件

1. url必须为当前域名

2. 需要重定向到授权链接再跳转回来(带上用户信息)

 

遇到的问题是微信分享的时候,url会给你改变(例如http://a.com/#/index 变成http://a.com/?fromsingle#/index),我的处理办法是:

在main.js里面:

然后再window.location.href=拼成微信的授权链接

 

调起微信支付需要配置授权链接,单页应用hash模式下,Android和IPhone微信处理方式不一样,Android要正常点,IPhone常常会提示url未授权。因为两者默认的当前url地址不一样,比如我们支付页面的地址为a.com/wx/#/pay,我们也在微信授权配置这个地址,Android可以正常支付。在IPhone下,如果你是从其他页面进入的这个支付页面,比如从a.com/wx/#/index进入的,那么此时IPhone会把第一次进入的地址提交到微信进行支付,由于这个地址没有配置授权,所以提示未授权。

 

怎么处理这个问题呢?怎么只配置一个授权地址就满足所有页面的支付呢?

1. 前端地址使用a.com/wx/?#/path (就是这个问号?的作用)

2. 微信授权地址配置为a.com/wx/

 

当然有可能你要问如果没有wx这个路径呢?nginx配置location就行了

vue
作者:张雪飞
出处:https://zhangxuefei.site/p/2014
版权说明:欢迎转载,但必须注明出处,并在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。

发表评论

电子邮件地址不会被公开。 必填项已用*标注