微信返回按钮ios和安卓兼容最终方案

最近碰见了一个微信控制返回按钮跳转到自己指定页面的问题。

目标1.：A页面（首页）--》B页面--》C页面，当页面跳转到C页面之后，点击返回想跳过B页面直接返回A页面，在A页面点击返回直接关闭（依靠微信本身）；

目标2：A页面（首页）--》B页面--》C页面--》D页面--》E页面，当跳转到E页面后，点击返回直接跳过中间的D,C,B直接返回A页面，在A页面点击返回直接关闭（依靠微信本身）；

最简单的办法百度了很久，采取了很多代码，最终个都发现不是很合适，总是有着各式各样的问题。如下：

1.采用popstate和 pushState的方法。因为pushState本身就是创建新的历史。这样只会让其他页面的返回也变得逻辑更加负载。甚至中间我还出现Ios甚至返回页面时不刷新页面但是会执行本页面的popstate和上一个页面的popstate。

2.采用 window.document.referrer会刷新上一页，但是同时也产生了新的历史记录,影响了其他页面的返回操作。

3.采用history.go(-1)会造成不刷新上一个页面。

经过上面的测试我慢慢的了解到了我具体的需求：

1.返回到的页面需要刷新

2.不产生新的历史记录

3.无节制的多层页面，而且一点返回还能回到最初自己期待的页面

经过自己翻看API去了解pushState和replaceState的本质作用后发现其实很简单。代码如下：

//替换当前链接的历史记录，此时不会跳转页面
history.replaceState({}, '', url);
//刷新当前页面，并且不留历史
location.reload();

解释：不断的采取replaceState替换当前页面的历史记录，然后再刷新当前，这样就不断的把当前的页面进行肆意的改动，跳转到最终页面后，点击一个返回按钮，一下子返回到了初始页面。这种方式应该是最简单的处理方式，比起我参考的那些既复杂又部分实现我需求的代码来说这应该是终极方案了。自己记录下，也让大家少走点弯路