HTML5历史记录API：刷新和返回问题

Question

我正在编写代码来创建一个类似于从时间线上在Facebook上观看照片的用户体验......

1. 查看时间轴，点击照片，然后以模态
打开
2. 您刷新并转到图像的专用页面
3. 您回击并返回时间线

我通过 HTML5历史记录API 完成了大部分工作。这是我点击图片时正在做的事情......

1. 我使用preventDefault()来避免链接（到图像页面），而是AJAX加载带图像的模态
2. 我pushState图片页面的URI，因此它显示在地址栏中
3. 现在我刷新并且我被带到专用图像页面（步骤＃2中的URI）
4. 然后我点击“返回”按钮，它显示地址栏中的上一页URI（即时间轴），但我仍然在图像页面上。

问题：在第4步，有没有办法绕过历史API，让浏览器执行标准的“后退”操作，这样我就可以返回上一页（即时间轴） ）？

Answer 1

你有没有尝过一个好的'{1}}？

Answer 2

我这样做：

第1步 - 保存初始页面网址（尚未更改）

var savedPageStateURL = window.location.pathname;

第2步 - 替换当前的历史记录状态（不推送，仅替换）

window.history.replaceState( {}, null , url );

第3步 - 恢复历史记录更改并返回第一步状态

if( 'pushState' in window.history && window.history.state )
    window.history.replaceState( {}, null , savedPageStateURL );