.net - 如何管理多个 Cdn 文件及其 CdnFallBackExpression？

Question

如果我想通过 bundleconfig.vb 文件管理我的 Cdn 文件并从 Cdn 加载 Kendo-ui，我需要像这样创建 2 个包:

    Dim kendoWebBundle = New ScriptBundle("~/bundles/kendo", kendoCndWeb).Include("~/Scripts/kendo/kendo.web.min.js")
    kendoWebBundle.CdnFallbackExpression = "typeof kendo"
    bundles.Add(kendoWebBundle)

    Dim kendoAspBundle = New ScriptBundle("~/bundles/kendoMvc", kendoCndAsp).Include("~/Scripts/kendo/kendo.aspnetmvc.min.js")
    kendoAspBundle.CdnFallbackExpression = "typeof kendo"
    bundles.Add(kendoAspBundle)

但是，我的第二个回退表达式将不起作用，因为 kendo 将被定义:

输出:

<script src="//cdn.kendostatic.com/2014.2.716/js/kendo.web.min.js"></script>
<script>(typeof kendo)||document.write('<script src="/Gabarit.Web/bundles/kendo"><\/script>');</script>

<script src="//cdn.kendostatic.com/2014.2.716/js/kendo.aspnetmvc.min.js"></script>
<script>(typeof kendo)||document.write('<script src="/Gabarit.Web/bundles/kendoMvc"><\/script>');</script>

是否有一些 kendo.aspnetmvc 回退表达式，或者我是否需要一起管理我的 Cdnfallback(bundleconfig 中没有 fallbackExpression，手动验证 kendo 类型，如果未定义，在本地加载所有 kendo 文件)？

如果我选择第二个选项，如果我的 CDN 发送 kendo.web.min.js 而不是 kendo.aspnetmvc.min.js 会发生什么情况？我觉得 kendo 会被定义并且不会发生本地回退......

Answer 1

使用本地脚本回退从 CDN 引用 Kendo UI

这就是Telerik suggests你应该做。

只需测试单个脚本，如果失败则在本地加载所有内容。因此，不要先测试 kendo.all.min.js，然后再测试 kendo.aspnetmvc.min.js，如果 CDN 有问题，您可能什么也得不到。

<script src="http://cdn.kendostatic.com/2014.1.318/js/kendo.all.min.js"></script>
<script>
    if (typeof kendo == "undefined") {
        // checking for loaded CSS files is cumbersome,
        // that's why we assume that if the scripts have failed, so have the stylesheets

        // fallback to local Kendo UI stylesheets
        document.write(decodeURIComponent('%3Clink rel="stylesheet" href="/path/to/local/kendo.common.min.css" %3C/%3E'));
        document.write(decodeURIComponent('%3Clink rel="stylesheet" href="/path/to/local/kendo.blueopal.min.css" %3C/%3E'));

        // fallback to local Kendo UI scripts
        document.write(decodeURIComponent('%3Cscript src="/path/to/local/kendo.all.min.js" %3E%3C/script%3E'));
        // also add kendo.aspnetmvc.min.js or kendo.timezones.min.js, if needed
    }
</script>

ASP.NET 网络优化框架

就像你现在所做的那样，对下面的 C# 感到抱歉。只需将您的 Kendo UI 脚本放在单独的包中并指定 typeof kendo == undefined 回退表达式。

以同样的方式测试 CSS，如果 CDN 不提供脚本，那么您的 CSS 也不会在那里。

从 NuGet 获取 Microsoft.AspNet.Web.Optimization 包。现在，在您的 BundleConfig 中，您可以设置您的 bundle ，使其不仅包括 CdnPath，还包括 CdnFallbackExpression:

public static void RegisterBundles(BundleCollection bundles)
{        
    bundles.UseCdn = true;
    var kendo = new ScriptBundle("~/bundles/scripts/kendo", "http://cdn.kendostatic.com/2015.1.318/js/kendo.all.min.js").Include("~/Scripts/kendo/kendo.all.min.js");
    kendo.CdnFallbackExpression = "typeof kendo == undefined";
    bundles.Add(kendo);

    var kendoMvc = new ScriptBundle("~/bundles/scripts/kendoMvc", "http://cdn.kendostatic.com/2015.1.318/js/kendo.aspnetmvc.min.js").Include("~/Scripts/kendo/kendo.aspnetmvc.min.js");
    kendoMvc.CdnFallbackExpression = "typeof kendo == undefined";
    bundles.Add(kendoMvc);      

    BundleTable.EnableOptimizations = true;
}