H5 history.pushState 在微信内修改url后点击用safari打开/复制链接是修改之前的页面

[zrain]

Hey, nice work guys.

看到你回答了 微信内 pushState 相关的问题，我这里做了一些小尝试

我使用 H5 history.pushState 在微信内修改url后，点击 “用safari打开”/“复制链接” 发现链接地址是修改之前的地址，不知道这种情况有没有遇到过。

[progrape]

we got it~

[zrain]

补充一下：使用你的demo来看，pushState 修改了 url 在“用safari打开”时， safari里的url是修改后的url 。没有问题，但是我用 pushState 修改路径后, 在“用safari打开”时 ，safari里的url是修改前的url。使用“复制链接”功能也是如此。唯一的区别是我的url中没有“＃”号

[bruceCzK]

这个应该是微信的BUG，所以SPA里面如果用了Html5Mode，到微信支付的页面时候要刷新下才行。

[zrain]

Thx 我现在 每个页面都刷新一下 否则分享页面 复制链接 和用Safari打开都会有问题 同样感谢您的回复 祝您工作愉快 期待微信的修复

发自我的 iPhone

在 2015年12月17日，14:16，Bruce Chen [email protected] 写道：

这个应该是微信的BUG，所以SPA里面如果用了Html5Mode，到微信支付的页面时候要刷新下才行。

—
Reply to this email directly or view it on GitHub.

[wb-yangxing]

他监听的是hashchange， 不是pushState

[Hanruis]

同样遇到类似的问题，@bruceCzK 在 SPA 里面使用 hash 的，在 IOS 下，也是需要刷新了才能 config 成功。然后如果需要频繁刷新的话， SPA 就失去意义了。求解。

[bruceCzK]

@Hanruis 我现在是每个页面都重新调用接口获取签名然后 config 一次，而且安卓和 iOS 的表现还不太一样。
比如同样从 /a 切换到 '/b'，iOS 会认为 URL 确实变化了，需要重新注入配置信息，安卓就不需要，而且安卓上面不同机型内核还不一样，有些又是支持 pushState 的，总之挺分裂的。
另外 复制链接这东西，无解，只能在有些页面隐藏掉复制链接按钮

[Hanruis]

@bruceCzK 确实是。
另外有一点挺矛盾的，一方面，jssdk 里面说到 config 的时候，hash 部分不需要加上。
然而用 hash 实现的 webapp， 在公众号设置的支付目录一般都是 www.mywebapp.com/#pay/ 这样的目录。使用在支付页面 config 的时候，需要把这个 hash 加上才能支付。(─.─|||，不然会报，这个 url 未注册。

然后在 IOS 下需要刷新之后，这个 config 才能成功。纠结。。

[bruceCzK]

@Hanruis 有关支付目录有个小窍门，井号前面加一个问号，目录就会只计算到问好前面最后一个斜杠，具体可以看我博文 https://awesome-bruce.me/2016/02/03/spa-zhong-wei-xin-zhi-fu-mu-lu-de-she-zhi/

[Hanruis]

@bruceCzK woa，感谢！

[airyland]

@bruceCzK 因为微信客户端不同平台对history, hash的处理不同而且奇怪的实现真的浪费了好多时间，本来想做一个纯粹的单页面应用，用history，折腾到最后还是算了，直接用hash然后还是跳转到新页面去支付吧。然后因为router切换而出现的JSSDK config的问题直接就记录入口页面链接，当前页面链接，然后逐个试，只要出现wx.error, 就重新调用config。累感不爱，真希望微信能开个Repo来收集一下这些问题或者给个建议的处理方式。

顺便再提个问题如果能反馈给相关的同学就更好了，web开发工具对hash做了奇怪的处理：

输入这个地址打enter
http://localhost:6004/#!/a
url被处理成了这个样子，简直没法用。但是在js里进行hash设定又没问题。
http://localhost:6004/#!/%21/a

[progrape]

@airyland Web 开发者工具的问题收到，近期修复

[J22Melody]

求问这个问题什么时候能修复？ T.T

[magicly]

http://mp.weixin.qq.com/wiki/7/aaa137b55fb2e0456bf8dd9148dd613f.html 里说：
所有需要使用JS-SDK的页面必须先注入配置信息，否则将无法调用（同一个url仅需调用一次，对于变化url的SPA的web app可在每次url变化时进行调用,目前Android微信客户端不支持pushState的H5新特性，所以使用pushState来实现web app的页面会导致签名失败，此问题会在Android6.2中修复）。、

但是我们测试，发现6.3还是有问题啊。 iOS也有问题， 请问这个是bug么

[lzbSun]

@magicly 我们也出现这个问题，你们解决了没有

[lzbSun]

我们IOS是正常的 @magicly 就是安卓端微信不行

[Roeis]

测试发现是x5内核就会出现pushstate问题，ios和Android都有这个问题。在X5里，url栏不会改变，微信都是6.3的版本

[dev-johnny-gh]

@Roeis +1，微信是移动端的ie6果然不是浪得虚名。

[zlzdp]

我也遇到这样的问题。history 修改后，微信中使用 safari 打开，url 中的参数全部丢失了。SPA 在微信中存在如此大的问题是我从来没有想过的。

[smalin]

问题依然存在。所以 iphone 只加载一次 we.config(config)， 安卓在每次 url 变化之后重新 wx.config(config)

[zhangjiayin]

进入页面的时候config 所有需要的权限 试试？ 以后在config 的时候忽略掉错误。强行调用！wx api

[mishe]

问题依然存在，没有解决bug的期限吗？

[mishe]

6.3.31貌似解决了，但为什么最新版的还是复现了？

[jiangfengming]

bug又回来了，没人管吗？

[wuchangming]

iOS 微信6.5.6版本。location.reload() 会导致通过Safari打开的按钮都消失了。。。。。

[asbai]

现在最新的微信 iOS 版上确实有这个问题？何时解决？

[wuchangming]

解决方案：url参数增加随机参数

function wxRefresh() {
    var replaceQueryParam = (param, newval, search) => {
        var regex = new RegExp('([?;&])' + param + '[^&;]*[;&]?');
        var query = search.replace(regex, '$1').replace(/&$/, '');

        return (query.length > 2 ? query + '&' : '?') + (newval ? param + '=' + newval : '');
    };

    window.location.replace(location.protocol +
        '//' +
        location.host +
        location.pathname +
        replaceQueryParam('_wxr_', new Date().getTime(), location.search) +
        location.hash);
};
// 执行
wxRefresh();

[MuLoo]

直至2019-08-02，问题还没解决。

[ZyanWlayor]

直到2019-08-06，问题还没解决。

[nieyulin112]

微信授权页面，地址栏拼接了code，立即分享，分享的页面是自定义的，结果分享出去的页面也是带有code，这样新用户点进来就会报错，大家有好的解决办法吗？

[lhf168]

你应该把要分享的链接进行处理。不能直接取当前页面的url放作为分享url。------------------ 原始邮件 ------------------ 发件人: "nieyulin"<[email protected]> 发送时间: 2019年8月7日(星期三) 上午8:45 收件人: "Tencent/weui"<[email protected]>; 抄送: "lhf168"<[email protected]>;"Comment"<[email protected]>; 主题: Re: [Tencent/weui] H5 history.pushState 在微信内修改url后点击用safari打开/复制链接是修改之前的页面 (#125) 微信授权页面，地址栏拼接了code，立即分享，分享的页面是自定义的，结果分享出去的页面也是带有code，这样新用户点进来就会报错，大家有好的解决办法吗？ &mdash; You are receiving this because you commented. Reply to this email directly, view it on GitHub, or mute the thread.

[nieyulin112]

你应该把要分享的链接进行处理。不能直接取当前页面的url放作为分享url。------------------ 原始邮件 ------------------ 发件人: "nieyulin"[email protected] 发送时间: 2019年8月7日(星期三) 上午8:45 收件人: "Tencent/weui"[email protected]; 抄送: "lhf168"[email protected];"Comment"[email protected]; 主题: Re: [Tencent/weui] H5 history.pushState 在微信内修改url后点击用safari打开/复制链接是修改之前的页面 (#125) 微信授权页面，地址栏拼接了code，立即分享，分享的页面是自定义的，结果分享出去的页面也是带有code，这样新用户点进来就会报错，大家有好的解决办法吗？ — You are receiving this because you commented. Reply to this email directly, view it on GitHub, or mute the thread.

我删除了code还是不行，就是会自动带上code，在工具里调试是可以的，一到手机上就有问题了，分享出去的页面就是会带上code

[lhf168]

你把要分享的页面链接进行处理，处理成你想要的格式。别人点击进来，你做个重定向------------------ 原始邮件 ------------------ 发件人: "nieyulin"<[email protected]> 发送时间: 2019年8月7日(星期三) 上午9:12 收件人: "Tencent/weui"<[email protected]>; 抄送: "lhf168"<[email protected]>;"Comment"<[email protected]>; 主题: Re: [Tencent/weui] H5 history.pushState 在微信内修改url后点击用safari打开/复制链接是修改之前的页面 (#125) 你应该把要分享的链接进行处理。不能直接取当前页面的url放作为分享url。------------------ 原始邮&#x4EF6; ------------------ 发&#x4EF6;人: "nieyulin"[email protected] 发送时间: 2019年8月7日(星期三) 上午8:45 收&#x4EF6;人: "Tencent/weui"[email protected]; 抄送: "lhf168"[email protected];"Comment"[email protected]; 主题: Re: [Tencent/weui] H5 history.pushState 在微信内修改url后点击用safari打开/复制链接是修改之前的页面 (#125) 微信授权页面，地址栏拼接了code，立即分享，分享的页面是自定义的，结果分享出去的页面也是带有code，这样新用户点进来就会报错，大家有好的解决办法吗？ — You are receiving this because you commented. Reply to this email directly, view it on GitHub, or mute the thread. 我删除了code还是不行，就是会自动带上code，在工具里调试是可以的，一到手机上就有问题了，分享出去的页面就是会带上code &mdash; You are receiving this because you commented. Reply to this email directly, view it on GitHub, or mute the thread.

[falost]

大哥们，业务型的不需要在这里讨论吧

…

在 2019年8月7日，09:30，lhf168 ***@***.***> 写道： 你把要分享的页面链接进行处理，处理成你想要的格式。别人点击进来，你做个重定向------------------ 原始邮件 ------------------ 发件人: ***@***.***> 发送时间: 2019年8月7日(星期三) 上午9:12 收件人: ***@***.***>; 抄送: ***@***.******@***.***>; 主题: Re: [Tencent/weui] H5 history.pushState 在微信内修改url后点击用safari打开/复制链接是修改之前的页面 (#125) 你应该把要分享的链接进行处理。不能直接取当前页面的url放作为分享url。------------------ 原始邮&#x4EF6; ------------------ 发&#x4EF6;人: ***@***.*** 发送时间: 2019年8月7日(星期三) 上午8:45 收&#x4EF6;人: ***@***.***; 抄送: ***@***.******@***.***; 主题: Re: [Tencent/weui] H5 history.pushState 在微信内修改url后点击用safari打开/复制链接是修改之前的页面 (#125) 微信授权页面，地址栏拼接了code，立即分享，分享的页面是自定义的，结果分享出去的页面也是带有code，这样新用户点进来就会报错，大家有好的解决办法吗？ — You are receiving this because you commented. Reply to this email directly, view it on GitHub, or mute the thread. 我删除了code还是不行，就是会自动带上code，在工具里调试是可以的，一到手机上就有问题了，分享出去的页面就是会带上code &mdash; You are receiving this because you commented. Reply to this email directly, view it on GitHub, or mute the thread. — You are receiving this because you commented. Reply to this email directly, view it on GitHub <#125?email_source=notifications&email_token=ADIS6M3M3MDFANOFCOORPZTQDIQTNA5CNFSM4BWVXMQ2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOD3W5H3Q#issuecomment-518902766>, or mute the thread <https://github.com/notifications/unsubscribe-auth/ADIS6M2KL4GZ2BDXN7WPWSTQDIQTNANCNFSM4BWVXMQQ>.

[blinkJun]

直到2019-08-08，问题还没解决。

[Grifree]

直到2019-08-20，问题还没解决。

[xujunjie10]

直到2019-08-23，问题还没解决。

[Ivy-Pei]

直到2019-09-06，问题还没解决。

[proactivefly]

直到2019-09-10 18:30，问题还没解决

[lqfxz520]

直到2019-10-21 ，问题还没解决

[wsxgs]

直到2019-10-30 ，问题还没解决

[zeezzh]

直到2019-11-7 ，问题还没解决

[yerxichen]

weui已经凉了，换其他框架吧

…

------------------&nbsp;原始邮件&nbsp;------------------ 发件人:&nbsp;"five6002776"<[email protected]&gt;; 发送时间:&nbsp;2019年11月7日(星期四) 上午10:32 收件人:&nbsp;"Tencent/weui"<[email protected]&gt;; 抄送:&nbsp;"Subscribed"<[email protected]&gt;; 主题:&nbsp;Re: [Tencent/weui] H5 history.pushState 在微信内修改url后点击用safari打开/复制链接是修改之前的页面 (#125) 直到2019-11-7 ，问题还没解决 — You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub, or unsubscribe.

[Danielmelody]

WTF, why not reopen this issue, does the maintainer cannot see thousands of comments?

[shiyutim]

在需要 复制链接 的页面， mounted 里面，使用 this.$router.go(0)，就解决了。

[zengpeng123]

在需要 复制链接 的页面， mounted 里面，使用 this.$router.go(0)，就解决了。

你这无限刷新页面了

[shiyutim]

谢谢提醒，不好意思，我看了下确实会无限刷新页面。当时用ios测的时候没注意，因为没显示刷新条。我想了下，可以在第一次进去的时候url添加个参数，带参数的时候才刷新，然后重新进入下页面。 获取 Outlook for iOS<https://aka.ms/o0ukef>

…

________________________________ 发件人: zengpeng123 <[email protected]> 发送时间: Thursday, November 28, 2019 11:28:33 AM 收件人: Tencent/weui <[email protected]> 抄送: shiyu <[email protected]>; Comment <[email protected]> 主题: Re: [Tencent/weui] H5 history.pushState 在微信内修改url后点击用safari打开/复制链接是修改之前的页面 (#125) 在需要 复制链接 的页面， mounted 里面，使用 this.$router.go(0)，就解决了。 你这无限刷新页面了 ― You are receiving this because you commented. Reply to this email directly, view it on GitHub<#125?email_source=notifications&email_token=ALYEK4QD72E2UBSGP5EVYLDQV43GDA5CNFSM4BWVXMQ2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEFLKOUY#issuecomment-559327059>, or unsubscribe<https://github.com/notifications/unsubscribe-auth/ALYEK4SXAC4T2A5VFOA43LDQV43GDANCNFSM4BWVXMQQ>.

[hawtim]

2019-12-24 最新版微信 复制链接会变化了

[fakefish]

直到2020-03-23 ，部分iOS上问题还会出现

[kongxu633]

直到2020-04-19 ，部分iOS上问题还会出现

[anota]

直到2020-07-01 ，部分iOS上问题还会出现

[anota]

发现通过pushState修改然后this.$router.go(0) 确实会更新url，但是这个会触发后台的请求，也算是刷新的方式，但是对于用户确实没啥感知。

[Look-For-Chestnut]

直到2020-08-07 ，部分iOS上问题还会出现，移动端的IE6得加油了...

[shinvdu]

直至2020-10-28，问题还没解决。

[ishowman]

同样遇到类似的问题，@bruceCzK 在 SPA 里面使用 hash 的，在 IOS 下，也是需要刷新了才能 config 成功。然后如果需要频繁刷新的话， SPA 就失去意义了。求解。

改成使用 history 模式能解决这个问题吗？

[CatcherInSky]

现在看还是，pushState之后，复制链接还是未修改之前的。。。

[lhf168]

这是来自QQ邮箱的假期自动回复邮件。   您好，我已收到你发的邮件，我会尽快回复你！