javascript 为什么 Google Chrome 不重新加载我的脚本？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/10045424/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Why isn't Google Chrome reloading my scripts?
提问by corazza
So, I have a script called "engine", and after much headbashing and (futile) debugging, I've found out that GC simply isn't reloading it!
所以，我有一个名为“引擎”的脚本，经过多次抨击和（徒劳的）调试后，我发现 GC 根本没有重新加载它！
This is how I include it in the webpage (inside the <head>element):
这就是我将它包含在网页中（<head>元素内部）的方式：
<script type="text/javascript" src="engine.js"></script>
When a put 10 console.log("asdf");'s at the start of the script, it's like they aren't there. When I went to the "resources" tab in the GC console, I saw that no changes are being applied whatsoever to that script! Hlep? Would putting a + "?" + new Date()at the end help?
当console.log("asdf");在脚本的开头放置 10 时，就好像它们不存在一样。当我转到 GC 控制台中的“资源”选项卡时，我看到该脚本没有任何更改！赫莱普？将 a+ "?" + new Date()放在最后有帮助吗？
回答by ccpizza
The universal solution that works in Chrome, Firefox and IE is cleaning the cache via Ctrl+Shift+Del(on Mac ?+Shift+?).
适用于 Chrome、Firefox 和 IE 的通用解决方案是通过Ctrl+ Shift+ Del（在 Mac ?+ Shift+ 上?）清除缓存。
Chrome solution #1
Chrome 解决方案 #1
- Open Developer Tools (F12or ?+?+i, or right-click → Inspect).
- Select the Networktab and tick the Disable cachecheckbox.
- 打开开发人员工具（F12或?+ ?+ i，或右键→检查）。
- 选择网络选项卡并勾选禁用缓存复选框。
- Reload the page.
- 重新加载页面。
??Note: The cache will be disabled onlywhen the devtools window is open.
?? 注意：只有在 devtools 窗口打开时才会禁用缓存。
Chrome solution #2
Chrome 解决方案 #2
This only makes sense if #1 is not used.
这仅在不使用 #1 时才有意义。
- Open Developer Tools.
- Click the Settingscogwheel icon in the bottom right corner.
- In the dialog that appears, select under the Networksubsection the Disable cachecheckbox: from now on the cache will be skipped when the devtools window is open. When the devtools windows is closed caching will work as usual.
- 打开开发者工具。
- 单击右下角的设置齿轮图标。
- 在出现的对话框中，选择Network子部分下的Disable cache复选框：从现在开始，当 devtools 窗口打开时，将跳过缓存。当 devtools 窗口关闭时，缓存将照常工作。
Chrome solution #3: empty cache + hard reload
Chrome 解决方案 #3：清空缓存 + 硬重新加载
- Open Developer Tools (otherwise the menu in the next step won't show).
- Click and hold down the Refreshbutton, and then select from the dropdown Empty Cache and Hard Reload.
- 打开开发人员工具（否则下一步中的菜单将不会显示）。
- 单击并按住Refresh按钮，然后从下拉列表中选择Empty Cache 和 Hard Reload。
Modifying javascript code
修改javascript代码
A browser-agnostic solution which could be used for debugging is to append in your server-side code a randomly-generated version string as a query parameter, i.e. call your script as:
可用于调试的浏览器无关解决方案是在您的服务器端代码中附加一个随机生成的版本字符串作为查询参数，即将您的脚本调用为：
<script type="text/javascript" src="myscript.js?ver=12345"></script>
<script type="text/javascript" src="myscript.js?ver=12345"></script>
This trick will force the browser to reload the script when the value of the verparameter changes. If you make ajax requests then you can append "?ver=" + new Date().getTime()to your URL.
这个技巧会强制浏览器在ver参数值改变时重新加载脚本。如果您发出 ajax 请求，那么您可以附加"?ver=" + new Date().getTime()到您的 URL。
NOTE: Don't forget to remove the parameter when you are finished debugging because in production you most likely dowant the scripts to be cached. It is a common practice though to generate a new timestamp on each new build — this can be used in production, and will ensure that after a new deployment the clients will always get the updated scripts.
注意：完成调试后不要忘记删除该参数，因为在生产中您很可能确实希望缓存脚本。尽管在每个新构建上生成一个新的时间戳是一种常见的做法——这可以在生产中使用，并将确保在新部署之后客户端将始终获得更新的脚本。
Unlike all the above solutions this one will work even when you have some sort of caching (e.g. redis, memcached, varnish) or CDN (e.g. akamai, cloudflare, cloudfront, etc) between the client and the server.
与上述所有解决方案不同，即使您在客户端和服务器之间有某种缓存（例如 redis、memcached、varnish）或 CDN（例如 akamai、cloudflare、cloudfront 等），该解决方案也能正常工作。
回答by jfriend00
It is possible that the script is cached so the old version is loading from cache. If you want to make sure you get a new version, you can force a browser reload, clear your browser cache or change the name of the script or put a different query parameter on the end of the filename.
脚本可能已缓存，因此旧版本正在从缓存加载。如果您想确保获得新版本，您可以强制重新加载浏览器、清除浏览器缓存或更改脚本名称或在文件名末尾放置不同的查询参数。
回答by takaz
This bugged me as well; CTRL+F5 or SHIFT+F5 never worked... The only things that works is opening your dev tools (hit F12), and right-click the reload icon next to the address bar and then selecting either "Hard Reload" or "Empty Cache and Hard Reload"
这也困扰着我；CTRL+F5 或 SHIFT+F5 从未奏效...唯一有效的是打开开发工具（按 F12），然后右键单击地址栏旁边的重新加载图标，然后选择“硬重新加载”或“清空”缓存和硬重载”
回答by raz3r
As I said in the comment I guess it's a cache problem, a CTRL+F5 should be enough, in case it is not go for CTRL+SHIFT+CANC and clear browsing data. However sometimes it's the server that has some kind of cache, I say that because with IBM WebSphere I often get cache problems that I can't resolve with a simple F5 on my browser. I just have to wait for my web server to "refresh" itself.
正如我在评论中所说，我猜这是一个缓存问题，CTRL+F5 应该就足够了，以防它不适用于 CTRL+SHIFT+CANC 并清除浏览数据。然而，有时它是具有某种缓存的服务器，我这么说是因为使用 IBM WebSphere 我经常遇到缓存问题，我无法在浏览器上使用简单的 F5 来解决这些问题。我只需要等待我的网络服务器“刷新”自己。
回答by Espionage
In the latest chrome stable 21st Oct 2016.
在 2016 年 10 月 21 日的最新 chrome 稳定版中。
- Open Developer Tools (F12 or right-click > Inspect or vertical ellipsis icon in address bar right corner > More Tools > Developer Tools).
- 打开开发人员工具（F12 或右键单击 > 地址栏右上角的检查或垂直省略号图标 > 更多工具 > 开发人员工具）。
- Click the vertical ellipsis icon in the top right corner of Developer Tools navigation bar > settings.
- 单击开发者工具导航栏右上角的垂直省略号图标 > 设置。
- In the Preferences section find the Network > Disable cache.
- 在首选项部分找到网络 > 禁用缓存。
