MVC4 捆绑来自不同域的 javascript 或 css 文件？答案

【问题标题】：MVC4 bundling javascript or css files from a different domain?MVC4 捆绑来自不同域的 javascript 或 css 文件？
【发布时间】：2023-03-15 11:51:01
【问题描述】：

在 MVC4 的 Web.Optimization 捆绑/最小化中，是否可以在一个站点（我们的静态无 cookie 域）上注册一个捆绑包，然后在另一个站点（我们的 webapp 域）上使用该捆绑包？

例如 static.myapp.com 有一个 BundleConfig.cs

public static void RegisterBundles(BundleCollection bundles)
{
    bundles.Add(new ScriptBundle("~/Scripts/static")
                .Include("~/Scripts/*.js"));
}

可以在 webapp 域的视图中使用该捆绑包吗，例如 www.myapp.com 在 Site.Master 中有这个

<%= Scripts.Render("static.myapp.com/Scripts/static") %>

这可以通过 MVC4 捆绑完成吗？从无 cookie 的静态域提供静态文件是一项众所周知的性能改进。

【问题讨论】：

标签： c# asp.net-mvc-4 bundling-and-minification cookieless system.web.optimization

【解决方案1】：

ASP.net MVC 中的捆绑允许您通过在运行时而不是在设计时替换占位符 Scripts.Render() 来优化脚本和样式表的部署。当页面被解析并推送到客户端时，注册到调用服务器的包被解析到输出缓冲区。因此，提供内容的应用程序必须运行捆绑器服务。如果未运行捆绑的 Web 应用遇到 Scripts.Render() 元素，它将输出 null 或抛出异常。

但是，您可以在 RegisterBundles 方法中使用 CDN 引用，例如：

bundles.UseCdn = true;   //enable CDN support

//add link to jquery on the CDN
var jqueryCdnPath = "http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.7.1.min.js";

bundles.Add(new ScriptBundle("~/bundles/jquery",
            jqueryCdnPath).Include(
            "~/Scripts/jquery-{version}.js"));

在上面的代码中，在发布模式下会从 CDN 请求 jQuery，并且在调试模式下会在本地获取 jQuery 的调试版本。使用 CDN 时，您应该有一个回退机制，以防 CDN 请求失败。

编辑

您可以使用 ASP.Net MVC 作为来自 static.myapp.com 之类的 CDN

routes.MapRoute(
    "CDN",
    "cdn",
    new { controller = "Webpage", action = "Fetch" }
);

[OutputCache(Duration=300, Location=OutputCacheLocation.Any)]
public ActionResult Fetch()
{
    return new FileStreamResult(
                       GetScriptBundle(Request.QueryString["url"]),
                       "text/javascript");
}

【讨论】：

谢谢，是的，我可以试试。但是捆绑包将从 myapp.com 域呈现，我将失去从 static.myapp.com 呈现文件的好处（并发加载和无 cookie 加载）。所以我正在寻找的是一种在静态站点上注册和创建捆绑包但在 myapp 站点上引用的方法。 static 和 myapp 站点都是 mvc4，所以都可以运行 bundler，我只是想弄清楚如何跨站点进行操作
我正在更新我的答案，以了解如何将您的静态网站用作 CDN

【解决方案2】：

所以我刚刚遇到了这个要求，我在页面中巧妙地解决了它，有效地类似于这个；

<%
string jsStore = Context.IsDebuggingEnabled ? "~" : "static.mydomain.com";
string scriptTagFormat = Scripts.DefaultTagFormat.Replace("{0}", Url.Content(jsStore).TrimEnd('/') + "{0}");
%>

和

<%=Scripts.RenderFormat(scriptTagFormat, "~/bundles/allMyJS")%>

当然，您也可以在RegisterBundles() 中使用DefaultTagFormat，但这提供了更大的灵活性，因为；

您可以从不同环境的备用 web.config 中读取 jsStore。
如果您有开发、测试站点等，您可以在运行时修改 jsStore 以匹配不同的 {SERVER_NAME} 主机。

您也可以将它与这样的静态标签一起使用；

<script src='@Url.Content(jsStore + "/scripts/etc/lt-ie10.min.js")'></script>

同样的方法可以用于 CSS。

【讨论】：

【解决方案3】：

是的，请在此处查看我的答案：How to make bundles unminify and list individual files when using a cookieless static content server?

您不仅可以引用不同的域，而且如果您使用像我提供的那样的自定义 VirtualPathProvider，您还可以在调试模式下保持单独列出文件的能力。

除了在浏览器中更容易调试之外，您也不必在每次开发时（仅在添加或删除文件时）进行 JS 或 CSS 更改时重新构建以更新捆绑包。

【讨论】：