注意:这不是缓存问题,也不是服务器配置错误,也不是浏览器问题。经过仔细调查,我发现问题是由于我的代码中的一个问题: 够愚蠢的,我填充字段的选择查询先于我的更新查询,导致表单始终显示更新之前的值。重新加载后,当然会出现新更新的值,导致我看错了方向。
然而,这个问题很好地概述了面对缓存问题时所有可能的解决方案。
我正在构建一个应用程序,上面有表单,由数据库中的值填充。 用户可以更改表单的输入值。提交后(不是通过 AJAX),新值被保存到数据库并且再次显示相同的表单,这次包含新值,直接从数据库加载。但是:我的浏览器(Windows 7 上的 Chrome v27.0.1453.116m)缓存了旧值。只有当我再次导航到我的页面时才会显示新值。
<form id="edit_form" class="form" action="http://the.same.url/" method="post">
<input type="text" name="example" value="<?php echo $value_from_database; ?>" />
</form>
我遇到过几种解决方案,但都没有完全解决问题:
- 在表单标签上设置一个属性
autocomplete="off"
:这似乎没有效果。 - 在单个输入标签上设置属性
autocomplete="off"
:这也不会产生结果,即使结合上述解决方案也是如此 - 在页面加载时使用 JavaScript 重置表单:这会产生一些结果,但显然不会影响单选按钮和其他按钮。
- 防止通过元标记缓存页面,如此处所建议:Using <meta> tags to turn off caching in all browsers?此外,通过 .htaccess 或 php header 阻止缓存无效。
- 按照 Miro Markarian 在下面的评论中的建议,尝试通过向 action-url 添加一个随机数来阻止缓存
以下是建议解决方案的概述:Make page to tell browser not to cache/preserve input values
我有哪些选择?如果可能的话,我想避免异步发布我的表单。它开始看起来好像我别无选择。感谢任何输入。
请注意,此行为也出现在其他浏览器中,例如 IE10。
我的页面标题与我表单中输入的值相同,并且在提交新值时也没有改变,恕我直言,我们可以确定这是一个缓存问题。
Google Chromes 的 Web Developer 插件向我显示了以下 header :
Pragma: no-cache
Date: Sun, 30 Jun 2013 09:44:12 GMT
Content-Encoding: gzip
Vary: Accept-Encoding
Server: Apache
Transfer-Encoding: chunked
Content-Type: text/html; charset=utf-8
Cache-Control: no-store, no-cache, must-revalidate, post-check=0, pre-check=0
Connection: Keep-Alive
Keep-Alive: timeout=15, max=100
Expires: Thu, 19 Nov 1981 08:52:00 GMT
200 OK
最佳答案
您可以通过一些随机字符串更改输入的名称属性并将它们存储在隐藏的输入中。
<form id="edit_form" class="form" action="http://the.same.url/" method="post">
<input type="text" name="saejfb27982" value="..." />
<input type="text" name="iuqde37we83" value="..." />
<input type="hidden" name="associativeArray" value='{"example":"saejfb27982","example2":"iuqde37we83"}'>
</form>
(由于每次的名字都不一样,浏览器将无法匹配任何形式的缓存,自动补全...)
关于php - 表单提交后,在输入中显示新值而不是缓存的值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17349783/