jQuery 在每个脚本嵌入时发送查询字符串

Question

我正在使用 MaterializeCSS、AngularJS 和 jQuery 构建一个简单的网络应用程序。由于我使用的是 Materialize，并且由于我设计它的原因，我需要使用 jQuery.

在每个 AngularJS 视图中初始化侧边栏按钮

如果我在每个视图上都复制它，效果很好：

<script>
    $(".button-collapse").sideNav({
        menuWidth: 150
    });
</script>

但是，如果我创建一个名为 sidenav.js 的新 js 文件：

<script src='/js/sidenav.js'></script>

出于某种原因，jQuery（或者 Angular，但 XHR 是由 jQuery 发起的）发送带有查询字符串的 XHR 来加载此脚本，从而使缓存并由于延迟导致 'lag'。虽然在一些使用后所有视图都被缓存，但由于查询字符串，脚本不断重新加载：

[Thu Jul 21 16:39:31 2016] 192.168.0.103:38124 [200]: /js/sidenav.js?_=1469129949496
[Thu Jul 21 16:39:37 2016] 192.168.0.103:38123 [200]: /js/sidenav.js?_=1469129949497
[Thu Jul 21 16:39:42 2016] 192.168.0.103:38126 [200]: /js/sidenav.js?_=1469129949498
[Thu Jul 21 16:39:42 2016] 192.168.0.103:38125 [200]: /js/sidenav.js?_=1469129949499
[Thu Jul 21 16:39:47 2016] 192.168.0.103:38128 [200]: /js/sidenav.js?_=1469129949500
[Thu Jul 21 16:39:51 2016] 192.168.0.103:38129 [200]: /js/sidenav.js?_=1469129949501

如何阻止 jQuery 或 Angular 在其上放置查询字符串或其他缓存方法？

谢谢。

Answer 1

jQuery 和 angualr 都不会为您的页面加载脚本，浏览器会处理它。

例如，在 Google Chrome 中，您可以使用 F12 按钮打开调试控制台，然后转到网络选项卡并按 "disable cache"。这应该可以防止浏览器缓存您的资源。

Answer 2

jQuery 的 $.ajax() 函数在其 settings 对象中有一个 cache 参数。默认情况下，对于大多数数据类型，cache 是 true，但 jsonp 和 script 除外，它们默认为 false。这会导致随机 _ 查询参数。

如果您有权访问正在下载此脚本的特定 $.ajax() 调用，您可以通过将 cache: true 添加到该调用的 settings 对象来解决此问题。

否则，您可以使用 $.ajaxSetup() 和 cache: true 值。这应该做同样的事情，除非特定的 $.ajax() 调用中有 cache: false，或者如果对 $.ajaxSetup() 的其他调用覆盖了这个值。此外，如果其他一些代码依赖于默认的 cache 值，这也会影响该代码。

也有可能脚本是通过 $.getScript() 调用加载的，该调用不接受 settings 对象并且无法直接覆盖 cache 设置。如果是这种情况，您可以将 $.getScript() 更改为等效的 $.ajax() 调用并在其中添加 cache: true 设置，或者您可以使用 $.ajaxSetup().

有关详细信息，请参阅 $.ajax(), $.getScript(), and $.ajaxSetup() 的文档。

jQuery 在每个脚本嵌入时发送查询字符串

jQuery sending query strings on every script embebbeding

html

ajax

jquery

materialize

angularjs