javascript RequireJS:如果 CDN 失败的本地回退
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/12073768/
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
RequireJS: Local fallback for if CDN fails
提问by Austin
In my backbone app, I need to provide a fallback for each required file, in the case that the CDN that delivers them fails.
在我的主干应用程序中,我需要为每个必需的文件提供后备,以防提供它们的 CDN 失败。
I have tried overwriting require.onError
like so:
我试过require.onError
像这样覆盖:
require.onError = function (err) {
if (err.requireType === 'timeout') {
var url = err.requireModules;
if (!!~url.indexOf("jquery/"))
console.warn("CDN timed out, falling back to local jQuery.js")
require(["libs/jquery"]);
return;
if (!!~url.indexOf("jqueryui/"))
console.warn("CDN timed out, falling back to local jQueryUI.js")
require(["libs/jqueryui"]);
return;
if (!!~url.indexOf("underscore"))
console.warn("CDN timed out, falling back to local underscore.js")
require(["libs/underscore"]);
return;
if (!!~url.indexOf("backbone"))
console.warn("CDN timed out, falling back to local backbone.js")
require(["libs/backbone"]);
return;
}
}
The problem is that this will asynchronously load the fallback files. I need these files to load in order, just like the original require statement, where I use the order!
plugin.
问题是这将异步加载回退文件。我需要按顺序加载这些文件,就像我使用order!
插件的原始 require 语句一样。
With the overridden onError
: when the CDN fails to load, the fallback load is started, but not waited for. This presents a problem because the scripts are ordered to be loaded based on their dependencies. Here is a look at my original require
statement, that depends on the CDN:
使用覆盖onError
:当 CDN 加载失败时,回退加载会启动,但不会等待。这带来了一个问题,因为脚本是根据它们的依赖关系来加载的。这是我的原始require
声明,这取决于 CDN:
require([
"order!http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js",
"order!http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.23/jquery-ui.min.js",
"order!http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.3.3/underscore-min.js",
"order!http://cdnjs.cloudflare.com/ajax/libs/backbone.js/0.9.2/backbone-min.js",
"order!utils/date",
"order!core/core",
"order!core/errors",
"order!core/constants"
], function() {
...
}
回答by numbers1311407
What version of RequireJS are you using? It seems you might want to configure jQuery's fallback as a path in your config, then set up jQuery as a dependency on the other modules that need it. If you're using ~> 2.0, something like (untested):
您使用的是什么版本的 RequireJS?似乎您可能希望将 jQuery 的回退配置为配置中的路径,然后将 jQuery 设置为对需要它的其他模块的依赖。如果您使用的是 ~> 2.0,则类似于(未经测试):
// in your requirejs config
requirejs.config({
//To get timely, correct error triggers in IE, force a define/shim exports
// check.
enforceDefine: true,
paths: {
jquery: [
'http://somecdn.com/jquery.min', // your cdn
'lib/jquery' // your fallback
],
jqueryui: "http://somecdn.com/jquery-ui.min.js"
},
shim: {
jqueryui: ['jquery']
}
});
// then in your requires
require([jquery, jqueryui, foo, bar], function($) {
// stuff
});
They talk about how to do it in the wiki. If you are not using v2.x, there is a method for handling that here too.
他们在 wiki 中讨论了如何做到这一点。如果您没有使用 v2.x,这里也有一种处理方法。
If all the modules are configured to specify their own dependencies, you shouldn't need to worry about the order!
directives either.
如果所有模块都配置为指定自己的依赖项,则您也无需担心order!
指令。
回答by Austin
I have found a solution to the problem provided in RequireJS 2.x.x. There was a demand for this solution, so in turn, RequireJS added a paths
object to their config. This provides fallback functionality for CDNs, should they fail.
我已经找到了解决 RequireJS 2.xx 中提供的问题的解决方案 有对这个解决方案的需求,所以反过来,RequireJSpaths
在他们的配置中添加了一个对象。这为 CDN 提供了回退功能,以防它们失败。
It should also be noted that the order!
plugin has been deprecated in Require 2.0, so I also needed to make use of the shim
object to define dependencies. It's actually a pretty interesting idea.
还需要注意的是,order!
插件在 Require 2.0 中已经被弃用了,所以我还需要利用shim
对象来定义依赖项。这实际上是一个非常有趣的想法。
Here is my new require.config:
这是我的新 require.config:
require.config({
urlArgs: "ts="+new Date().getTime(), // disable caching - remove in production
paths: {
jquery: [
"http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min",
"libs/jquery"
],
jqueryui: [
"http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.23/jquery-ui.min",
"libs/jqueryui"
],
underscore: [
"http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.3.3/underscore-min",
"libs/underscore"
],
backbone: [
"http://cdnjs.cloudflare.com/ajax/libs/backbone.js/0.9.2/backbone-min",
"libs/backbone"
]
},
shim: {
'jqueryui': ['jquery'],
'underscore': ['jquery'],
'backbone': ['underscore'],
'core/core': ['underscore'],
'core/errors': ['core/core'],
'core/constants': ['core/core']
}
});