post-redirect-get(PRG)将相同的页面重新插入到Webkit浏览器的历史记录中

dlo*_*dlo 9 html webkit google-chrome mobile-safari post-redirect-get

假设我在/页面上?id = 1

然后我导航到/ page?id = 2

我在该页面上进行了更改,该页面实现了一个帖子,然后重定向回/ page?id = 2

在Firefox中,我可以点击后退按钮一次并返回/ page?id = 1,但是在iPhone上的Chrome和Safari中,我必须按两次后退按钮,因为/ page?id = 2在浏览器历史记录中两次.(如果我从id = 2发了多个帖子,我必须多次点击后退按钮才能最终返回id = 1.)

在某些方面,这似乎是正常的浏览器行为,因为每个GET只是被推入历史记录,但由于URL与前一个条目相同,这会导致糟糕的用户体验,这通常似乎被其他Web应用程序所避免...在Firefox中自然可以避免. 这是Webkit浏览器中不可避免的错误,还是我可以用不同的方式实现PRG来避免这种情况?

顺便说一句,行为似乎与302或303重定向相同.

更新:我已经模拟了一些示例代码...不知道是否有像jsfiddle这样的平台我可以上传这个以供您查看实际操作:

form.php的:

id=<?=$_REQUEST['id']?>
<form action="submit.php" method="post">
<input type="hidden" name="id" value="<?=$_REQUEST['id']?>">
<input type="submit" value="submit">
</form>
Run Code Online (Sandbox Code Playgroud)

submit.php:

<?php
header("Location: form.php?id=" . $_REQUEST['id']);
die($_REQUEST['id']);
?>
Run Code Online (Sandbox Code Playgroud)

如果我从form.php开始?id = 4(只是将它放在浏览器历史记录中)然后转到form.php?id = 5然后点击提交(好像要执行数据库更改),在Firefox中我得到每个历史记录中的一个条目; 在Chrome中,我得到一个id = 4的条目,然后是id = 5的两个条目.为什么行为不同?我认为Firefox的行为更好,因为回击两次以远离id = 5对用户来说是违反直觉的.

Ant*_*ber 1

尽管它没有解释所发生的情况,但我有一种在所有应用程序中使用的解决方法。首先是一些代码:

form.php看起来像这样:

id=<?=$_REQUEST['id']?>
<form action="submit.php" target="iframe" method="post">
    <input type="hidden" name="id" value="<?=$_REQUEST['id']?>">
    <input type="submit" value="submit">
</form>
Run Code Online (Sandbox Code Playgroud)

submit.php像这样:

<?php
    header("Location: form.php?id=" . $_REQUEST['id']);
    die($_REQUEST['id']);
?
<script>
    window.parent.location.reload();
</script>
Run Code Online (Sandbox Code Playgroud)

这是您的文档,标签中包含一些额外的内容<form>和一个全新的<script>标签

iframe我在文档中也会有这样的地方:

<iframe name="iframe"></iframe>
Run Code Online (Sandbox Code Playgroud)

所以要解释一下。您无需在每次需要进行更改时导航到新站点并再次返回,只需将其加载submit.phpiframe现有文档中即可。因此这一target="iframe"部分。

然后,当iframe加载完成后,意味着已进行更改,您将重新加载原始页面以反映这些更改,从而反映该window.parent.location.reload();部分。由于页面刚刚重新加载,因此不会在您的历史记录中添加第二个条目。

我希望这对你有帮助:)