Question

我使用MaterialiseCSS，AngularJS和jQuery来构建一个简单的webapp。由于我使用Materialise，并且由于我设计它的原因，我需要使用jQuery初始化每个AngularJS视图中的侧边栏按钮。

如果我在每个视图上复制它，它可以正常工作：

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

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

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

由于某种原因，jQuery（或者可能是Angular，但XHR由jQuery启动）发送带有查询字符串的XHR来加载此脚本，从而使缓存无效并导致“延迟”。由于延迟。在某些用法之后，所有视图都被缓存，由于查询字符串，脚本不断重新加载：

[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的$.ajax()函数在其cache对象中有一个settings参数。默认情况下，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()和$.ajaxSetup()的文档。

Answer 2

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

例如，在Google Chrome中，您可以使用F12按钮打开调试控制台，然后转到网络选项卡，然后按＆＃34;禁用缓存＆＃34;。这应该会阻止浏览器缓存您的资源。

jQuery在每个脚本上发送查询字符串embebbeding

2 个答案: