asp.net Bundling如何在内部工作

Question

我很想知道asp.net捆绑是如何工作的.

我知道我们要将所有脚本和CSS和图像添加到捆绑包中,以便浏览器启动对所有资源的单一请求.

我对网页如何从客户端浏览器引用这些捆绑资源感到困惑.

Answer 1

让我们来看看在System.Web.Optimization中使用捆绑时会发生什么.

在这个例子中,我使用了"Empty ASP.NET MVC 4模板",并从nuget中获取了最新的"Microsoft.AspNet.Web.Optimization"软件包.

然后我继续注册2个javascript文件.一个用于jquery,另一个用于bootstrap.

public static void RegisterBundles(BundleCollection bundles)
{
    var javascriptBundle = new Bundle("~/bundles/javascripts")
        .Include("~/Scripts/jquery-{version}.js")
        .Include("~/Content/bootstrap/js/bootstrap.js");
    bundles.Add(javascriptBundle);
}

现在我们完成了设置,让我们看看当我们查看页面时会发生什么.

你可以看到我们通常都会包含这两个javascript文件.当您在web.config中设置"debug"标志时会发生这种情况.

让我们把它变成假,看看现在发生了什么.

现在我们看到的是添加了一个参考,但具有非常独特的外观.通过单击它,我们看到它吐出了我们的包中引用的两个javascript文件的缩小和组合版本.

这个有趣的查询字符串参数v = loMmcAiXrKwMoVsM8Ok8Q5jVmuFQUI3fiiRVJQC33Hs1是对我们内容的引用,我们可以看到,无论我们访问网站多少次,它都将保持不变.(即刷新多次).

让我们看看fiddler对我们的javascript文件的引用所说的内容.

我们可以看到响应是可缓存的.缓存到期时间设置为"Wed,26 Mar 2014 06:49:06 GMT".从今天起近一年.

将从浏览器的缓存中读取对资源的后续请求."这个HTTP/304响应表明现有的缓存响应仍然是新鲜的.HTTP/304响应上的缓存生命周期头可用于更新缓存响应的新鲜度."

如果您需要更多信息,请参阅http://www.asp.net/mvc/tutorials/mvc-4/bundling-and-minification