禁用Sencha脚本加载器缓存破坏，但只在开发/调试时 [英] Disable Sencha script loader cache busting but only while developing/debugging

问题描述

我正在使用ExtJS 4.x和Sencha Architect 2.2，但这应该与后期版本以及使用 Ext.Loader 类动态加载的任何应用程序相关脚本，包括Sencha Touch。

I'm working with ExtJS 4.x and Sencha Architect 2.2 but this should be relevant to later versions and any application that uses the Ext.Loader class to dynamically load scripts, including Sencha Touch.

默认情况下添加？_ dc = ... cache busting参数，以确保每个脚本的最新版本都加载到浏览器中。当部署到生产或beta测试环境时，这是一件好事，因为它确保用户/测试人员在每次部署和更新时获取最新的脚本，但对于开发环境来说，这并不是真的必要，因为开发人员知道使用浏览器技术像 ctrl + F5 强制重新加载所有脚本。更重要的是，当您在浏览器中重新加载应用程序时，断点等丢失，缓存破坏就会被调试。

By default Ext.Loader adds a ?_dc=... cache busting parameter to make sure that the latest version of each script is loaded into the browser. When deploying to a production or beta-test environment this is a good thing as it ensures the user/tester gets the latest script each time you deploy and update, but for a development environment this is not really necessary because developers know to use browser techniques like ctrl+F5 to force a reload of all the scripts. What's more the cache busting gets in the way of debugging as breakpoints etc are lost whenever you reload the app in the browser.

通过将disableCaching设置为false禁用缓存禁用 Ext.Loader 配置。例如：

Cache busting is disabled by setting disableCaching to false in the Ext.Loader configuration. For example:

Ext.Loader.setConfig({
    enabled: true,
    disableCaching: false
});

在此代码段中，动态加载启用 ，缓存失效是>禁用。但是还有其他配置选项，如API文档 here 。

In this snippet the dynamic loading is enabled and cache busting is disabled. There are however other config options as described in the API docs here.

在Sencha Architect中，此代码是在 app.js 中为您生成的，您无法编辑它。建筑师有一个项目设置来启用缓存，但在版本2.2中它不适用于ExtJS 4.我认为它在以后的版本中可以正常工作，但似乎是全部或全部，所以你必须记住将其关闭并重新部署到非开发环境。

In Sencha Architect this code is generated for you in app.js and you can't edit it. Architect has a "Project Setting" to enable caching but in version 2.2 it doesn't work for ExtJS 4. I assume it works fine in later versions but it seems to be all-or-nothing so you have to remember to switch it off and rebuild for deploying to a non-dev environment.

我想要的是能够：

1. 解决建筑师版本2.2中的设置错误


2. 在生产中启用缓存无效，而不是在开发中，而不必
   重建我的应用程序
3. 
   

1. Workaround the settings bug in version 2.2 of Architect
2. Enable cache busting in "production" but not in dev without having to rebuild my app

推荐答案

可以多次调用不同的设置，并将设置合并在一起。对于我来说，这一点在文档但幸运的是，在来源中更为明显代码。

源代码还显示有一个未记录的形式的 setConfig 一个名称和值，而不是一个配置对象，但是因为它没有记录，我会坚持传递一个这样的对象：

The source code also shows that there is an undocumented form of setConfig where it takes a name and value instead of a config object, but as it's undocumented I'll stick with passing in an object like this:

Ext.Loader.setConfig({disableCaching: false});

知道这不会影响其他 Ext.Loader 配置在您的应用程序的其他地方设置，您可以在Ext加载之后，但在 Ext.onReady（）之前将此代码叫做。在Sencha Architect中，这可以通过将其放在JS资源中，如这里。

Knowing that this won't affect other Ext.Loader configs that are set elsewhere in your app you can put this code anywhere after Ext is loaded, but before the Ext.onReady() is called. In Sencha Architect this can be achieved by putting it in a "JS Resource" as described here.

这解决了我的问题的第一部分，但我也想要的是能够在没有重建的情况下将缓存关闭，所以我修改了代码来检查一个debugURL参数，如下所示：

That solves the first part of my question, but what I also want is to be able to turn cache busting off without rebuilding, so I modified the code to check for a "debug" URL parameter like this:

if (Ext.Object.fromQueryString(document.location.search).debug) {
    Ext.Loader.setConfig({disableCaching: false});
}

现在，当我想调试我的应用程序时，我可以使用一个看起来像：

Now when I want to debug my app I can use a URL that looks like:

http://myhost/.../app.html?debug=true

，并关闭缓存清除功能。我只是省略了调试参数，让其重新开启。

and the cache busting is turned off. I just omit the debug parameter for it to be turned back on.

这篇关于禁用Sencha脚本加载器缓存破坏，但只在开发/调试时的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！