Ajax為主的應用不需要ASP.NET MVC

更新：這是一個錯誤的觀點，詳情請看事實證明Ajax的世界更需要ASP.NET MVC。

部落格園在開發中至今還未使用ASP.NET MVC，似乎有點跟不上時代了，但是否採用一項技術，關鍵的是這個技術是否能真正解決實際問題。

這篇文章將以我們正在開發的部落格園新版站內短訊息功能為例，說明一下不需要ASP.NET MVC的理由。

功能簡介：短訊息收件匣，顯示目前使用者短訊息列表。

用到的主要技術：Master Page, jQuery, jQuery外掛程式Templates, WCF。

Templates是由微軟開發的jQuery外掛程式，功能類似於ASP.NET的Repeater控制項，Templates將被整合進jQuery 1.5成為核心組件。想更多瞭解Templates，推薦閱讀Microsoft and jQuery。

主要代碼：

1. ASP.NET分頁檔：

<%@ Page Title="" Language="C#" MasterPageFile="msg.master" %>
<asp:Content ID="ContentMain" ContentPlaceHolderID="cphMain" Runat="Server">
<div id="msg_list">
</div>
<script id="contentTmpl" type="text/x-jquery-tmpl">
<div class="msg_item">
<div class="msg_sender">${SenderName}</div>
<div class="msg_title">${Subject}</div>
<div class="msg_sendtime">${SendTime}</div>
</div>
</script>
<script type="text/javascript">
    GetMsgList(1, 30);
</script>
</asp:Content>

上面的代碼通過GetMsgList方法a調用WCF擷取短訊息列表，然後顯示在msg_list中。

這裡用Master Page是為了重用HTML的公用元素，不然，只要一個html檔案就夠了，.aspx都不需要，為什麼還要用ASP.NET MVC？對於這樣的ajax應用，只要載入一個簡單的html頁面，接下來就交給js了，就是需要MVC，也是在js中進行，ASP.NET MVC無用武之處。

不用ASP.NET MVC，這一個理由足矣。

為了完整地介紹這個樣本，繼續我們的代碼。

2. js代碼：

a) js檔案引用

<script type="text/javascript" src="http://common.cnblogs.com/script/jquery.js"></script>
<script type="text/javascript" src="http://common.cnblogs.com/script/json2.js"></script>
<script type="text/javascript" src="js/jquery.tmpl.min.js"></script>
<script type="text/javascript" src="js/msg.js"></script>

json2.js是用於將js對象轉換為json。

jquery.tmpl.min.js是jQuery外掛程式Templates的引用檔案。

msg.js中定義了GetMsgList方法。

b) GetMsgList方法定義：

function GetMsgList(pageIndex, pageSize) {
var msgQuery = {}
    msgQuery.PageIndex = pageIndex;
    msgQuery.PageSize = pageSize;

    $.ajaxSettings.type = 'post';
    $.ajaxSettings.dataType = 'json';
    $.ajaxSettings.contentType = 'application/json';
    $.ajaxSettings.url = '/services/AjaxMsgService.svc/GetMsgList';
    $.ajaxSettings.data = '{"msgQuery":' + JSON.stringify(msgQuery) + '}';
    $.ajaxSettings.success = function (data) {
        $("#contentTmpl").tmpl(data.d).appendTo("#msg_list");
    };
    $.ajax();
}

“/services/AjaxMsgService.svc”——調用的WCF服務，jQuery如何調用WCF請參考拋棄WebService，在.NET4中用 jQuery 調用 WCF。

“JSON.stringify(msgQuery)”——將msgQuery對象轉換為json，WCF中對應的方法是“GetMsgList(SiteMsgQuery msgQuery)”，達到的效果是將js對象作為參數傳給了WCF方法。在之前文章的評論中有人說jQuery調用.ashx更方便，從這裡的效果看，我覺得jQuery調用WCF（或.asmx）更方便。

$("#contentTmpl").tmpl(data.d).appendTo("#msg_list");——將WCF返回的資料繫結至contentTmpl（見代碼一）形成列表，並載入至msg_list，完成資料的顯示。這就是Templates外掛程式的作用。

3. WCF代碼：

[ServiceContract]
[AspNetCompatibilityRequirements(RequirementsMode = 
    AspNetCompatibilityRequirementsMode.Allowed)]
public class AjaxMsgService
{
    [OperationContract]
public SiteMsg[] GetMsgList(SiteMsgQuery msgQuery)
    {
int spaceUserId = Util.GetCurrentUser(HttpContext.Current).SpaceUserID;        
        msgQuery.SiteMsg = new SiteMsg() { RecipientSpaceUserId = spaceUserId };
//調用背景WCF服務
        MsgServiceClient client = new MsgServiceClient();
        SiteMsg[] siteMsgList = client.GetMsgList(msgQuery);
try { client.Close(); }
catch { client.Abort(); }

return siteMsgList;
    }
}

這裡的WCF相當於一個中轉站，它又去調用後台另外一台伺服器上的WCF服務，擷取短訊息資料，以json格式返回給用戶端js。

樣本介紹完畢，不足之處歡迎大家指出。

總結

隨著越來越多的Web應用使用Ajax，ASP.NET MVC施展身手的空間越來越小。

現在唯一阻礙Ajax使用的是搜尋引擎不能索引Ajax載入的內容，但這個情況一定會改觀，Ajax是趨勢，Web App是趨勢。