为什么Chrome不缓存我的动态表单字段？

Question

我正在遵循Symfony2中简单表单的Post/Redirect/Pattern。该表单包含一个id文本字段，由控制器动态填充随机值。

我注意到Chrome中有一些奇怪的行为 - 如果用户提交表单，然后点击返回，id字段会包含一个全新的值。如果我编辑此ID并重复此过程，则会缓存该值，因此看起来Chrome只在看到值已更改时才会缓存它。

这种行为在Firefox或Safari中不会发生。有没有办法让Chrome表现得与其他浏览器相同？在此问题中的答案说问题出在使用隐藏字段，但由于我只是使用标准文本字段，所以我感到困惑。

- Jonathan

---

也许 http://garlicjs.org/ 可以帮助你... - Guilherme Viebig

Answer 1

据我所知，目前没有标准规定这里应该发生什么。因此，您不能真正依赖浏览器的行为。

因此，如果对于您来说，当用户按下后退按钮时，它应该是新的ID，那么请使用一些客户端脚本来实现。无论使用什么浏览器都可以实现。

- Tobias Nyholm

---

我一开始想避免使用客户端脚本，因为我希望支持没有启用 JS 的用户，但看起来这可能是唯一的选择。谢谢你的答案。 - Jonathan

@Jonathan - 你知道你的网站访问者中有多少人禁用了JS吗？ - Spencer Ruport

Answer 2

我建议您使用本地存储来解决这个问题。

<input id="some_id">

<script type="text/javascript">

   localStorage.setItem("ID", "Some Id Value");

   if(! localStorage.getItem("ID"))
     localStorage.setItem("ID", "Some Id Value"); `

     $("#some_id").val(localStorage.getItem("ID"));
</script>

---

您可以检查本地存储是否可用。

if( typeof(Storage) !== "undefined" ) {
 // Your Browser support Local Storage
} else {
 // Your Browser does not support Local Storage
}

使用Chrome浏览器的控制台进行跟踪。我无法上传图片以说明此过程。请打开Chrome浏览器的控制台，

资源 -> 本地存储 -> 您的网站名称

- Tigin

Answer 3

现代浏览器会缓存表单输入值。因此，当用户刷新页面时，输入框中的值保持不变。因此，浏览器会获取html并使用该值创建输入框。

<input value="SOME_VALUE">

但是，如果用户修改了该字段，浏览器将使用用户的值而不是html的值。我建议您在id字段中添加autocomplete="off"。

- Alexey B.

---

正确。但我并不想关闭自动完成 - 实际上我是在询问相反的情况。 - Jonathan

我认为这是在所有浏览器上获得相同行为的唯一方法。这不是你想要的，但在我看来，这是你应该做的。然后你可以依赖于跨浏览器的行为... - AlterPHP