重新加载 javascript 和 CSS，最佳实践：PHP答案

【问题标题】：Reloading javascript and CSS, best practices: PHP重新加载 javascript 和 CSS，最佳实践：PHP
【发布时间】：2009-10-06 13:43:43
【问题描述】：

这更像是一个最佳实践问题，但对我来说非常重要，因为它让我多次认为我的 js 或 css 修改不起作用。

我使用 PHP，并将我的 CSS 和 JS 放在单独的文件中。有时当我点击循环重新加载按钮时，我的更改不会生效。我使用重新加载或在 URL 后重新点击 Enter。有时两者都不起作用，我不得不做一些疯狂的事情，比如重新启动浏览器以清除缓存。

例如，为了测试我是在使用旧的还是新的 JS，我使用了不同的警报消息，然后我发现它仍在使用旧的（最近更改前的）JS。 CSS 也是如此，我使用不同的颜色边框等来了解它是否采用了新的。不用说，我敢肯定还有比这更好的做法 :)

【问题讨论】：

【解决方案1】：

Ctrl-Shift-R 或 Ctrl-F5（Cmd + F5 mac 等效？）会进行硬刷新并强制用户代理从头开始下载所有内容。

【讨论】：

【解决方案2】：

您可以在点击重新加载时强制从服务器重新下载，在 Firefox 上使用 Ctrl+F5 之类的东西 （表示浏览器必须从服务器重新请求文件，而不是使用它的版本在你的机器上有缓存），或者在你的浏览器中取消激活缓存（至少，在开发 CSS/JS 相关的东西时）。

Firefox web-developper extension 是一个用于停用缓存的好工具：它为您提供了一个工具栏，让您在进行前端开发时可以快速访问几个有用的选项。

【讨论】：

【解决方案3】：

对于开发，您可以在 CSS 和 JS 文件的 URL 末尾添加一个随机数。比如：

<script type="text/javascript" src="/myscript.js?<?php echo rand(1, 200000);?>"></script>

或者

<link rel="stylesheet" href="/styles.css?<?php echo rand(1, 200000);?>">

只是不要在您的实时网站上这样做，否则您的用户会在每次请求时再次下载文件，从而使您的网站变慢。

【讨论】：

感谢您的回答。除了消除了按 Ctrl+F5 的手动步骤之外，这种方法是否比其他人建议的 Ctrl+F5 有任何其他优势？我问是因为我宁愿在需要时使用 Ctrl+F5 方式，也不愿添加在进入生产环境之前需要删除的代码。
我想不出任何其他优点。您可以添加检查以查看服务器是否正在生产，并添加随机数。那你就不用担心了:)

【解决方案4】：

Shift 单击重新加载按钮。

【讨论】：