出處：http://www.cnblogs.com/_popc 引言：當前能看到很多互聯網網站中有關web前端優化都採用js合併壓縮的方式輸出。樓主找了幾個地址參考 地址1、地址2 那麼下麵就開始瞭如何實現。 1.既然需要將js合併壓縮輸出那麼就先需要構造一個如上鏈接所示的那樣的鏈接地址。 @usi
出處：http://www.cnblogs.com/_popc
引言：當前能看到很多互聯網網站中有關web前端優化都採用js合併壓縮的方式輸出。樓主找了幾個地址參考
地址1、地址2
那麼下麵就開始瞭如何實現。
1.既然需要將js合併壓縮輸出那麼就先需要構造一個如上鏈接所示的那樣的鏈接地址。
@using MvcApplication.ExtensionsFolder
<html>
<head>
<title>@ViewBag.Title</title>
@Html.LoadJsList("jquery-1.4.4.min.js,jquery-ui.js,MicrosoftAjax.js&v=20121222")
</head>
然後看看有關給MvcHtmlString類的擴展方法LoadJsList的實現，在mvc中擴展方法的使用已經比較普遍了。
public static MvcHtmlString LoadJsList(this HtmlHelper htmlhelp, string ListJs)
{
StringBuilder sb = new StringBuilder();
string jsFormat = "<script type=\"text/javascript\" src=\"{0}\"></script>";
sb.AppendFormat(jsFormat, JsHandlerUrl + ListJs);
return new MvcHtmlString(sb.ToString());
}
2.這樣的話輸出頁面輸出就是
<script type="text/javascript" src="http://localhost:1309/ashx/MergerJsHandler.ashx?href=jquery-1.4.4.min.js,jquery-ui.js,MicrosoftAjax.js&v=20121222"></script>
至此我們已經完成一半了，接下來就是輸出合併以及壓縮出來的js了。
3.在MergerJsHandler.ashx文件中
private string JsHandlerUrl
{
get
{
return ConfigurationManager.AppSettings["jsAddress"] ?? string.Empty;
}
}
public void ProcessRequest(HttpContext context)
{
//"http://localhost:1309/ashx/MergerJsHandler.ashx?href=jquery-1.4.4.min.js,domestic.js,v=20121222
context.Response.ContentType = "text/plain";
HttpRequest request = context.Request;
HttpResponse response = context.Response;
if (!context.Request.QueryString.AllKeys.Contains("href"))
{
response.Write("error");
}
else
{
string[] filesName = request.QueryString["href"].Trim().Split(new string[] { ","}, StringSplitOptions.RemoveEmptyEntries);
Compress(request.QueryString["v"], context, filesName);
}
}
就是獲取參數然後調用compress方法做處理，並且輸出。
壓縮我採用的是Yahoo.Yui.Compressor 。這個壓縮工具既能壓縮js還可以壓縮css。
/// <summary>
///
/// </summary>
/// <param name="v">指示是否修改</param>
/// <param name="context">當前上下文</param>
private void Compress(string v, HttpContext context, string[] jsPar)
{
StringBuilder sb = new StringBuilder();
var SaveJsFilePath = ConfigurationManager.AppSettings["jsAddress"] ?? string.Empty;
var files = System.IO.Directory.GetFiles(context.Server.MapPath("~/") + SaveJsFilePath, v, SearchOption.TopDirectoryOnly);
if (files != null && files.Length > 0)//存在的話，直接輸出壓縮的內容
{
var content = File.ReadAllText(files[0], Encoding.UTF8);
sb.Append(content);
}
else//獲取各個js然後壓縮在一起，保存並輸出
{
foreach (var file in jsPar)
{
var path = context.Server.MapPath("~/") + JsHandlerUrl + file;
FileInfo finfo = new FileInfo(JsHandlerUrl + file);
string strContent = File.ReadAllText(path, Encoding.UTF8);
//取消文件只讀
File.SetAttributes(path, FileAttributes.Normal);
//if (finfo.Extension.ToLower() == ".js")
//{
//初始化JS壓縮類
var js = new JavaScriptCompressor();
js.CompressionType = CompressionType.Standard;//壓縮類型
js.Encoding = Encoding.UTF8;//編碼
js.IgnoreEval = false;//大小寫轉換
js.ThreadCulture = System.Globalization.CultureInfo.CurrentCulture;
//壓縮該js
strContent = js.Compress(strContent);
sb.Append(strContent);
//}
//else if (finfo.Extension.ToLower() == ".css")
//{
// //進行CSS壓縮
// CssCompressor css = new CssCompressor();
// strContent = css.Compress(strContent);
// File.WriteAllText(file, strContent, Encoding.UTF8);
//}
}
File.WriteAllText(context.Server.MapPath("~/") + SaveJsFilePath + v, sb.ToString(), Encoding.UTF8);
}
context.Response.Write(sb.ToString());
}
那麼這個列印出來的代碼就是我們成功處理後的了。
至此就大功告成了。當然上面的參數沒有做過濾等等的考慮，在實際開發中過濾和一些惡意的請求都是需要處理的，畢竟樓主還是沒有在實際開發中使用用過，不過應該相差不遠吧。呵呵。
最後看看效果
不過我有一個問題，就是為嘛合併請求的大小比那3個獨立的js大小還要大呢。難道是因為請求參數和請求頭裡邊有貓膩嗎。
