透過 ASP.NET Web API + jQuery 建立簡單 Web 應用

以「聯絡人管理」為例，後端以 Web API 形式發布 CRUD 服務，前端透過 jQuery 呼叫 API 處理互動。

Web API 服務定義

Contact 模型與 ContactController：

public class Contact
{
    public string Id { get; set; }
    public string FirstName { get; set; }
    public string LastName { get; set; }
    public string PhoneNo { get; set; }
    public string EmailAddress { get; set; }
}

public class ContactController : ApiController
{
    private static List<Contact> contacts = new List<Contact> { /* 初始資料 */ };

    public IEnumerable<Contact> Get() { return contacts; }
    public Contact Get(string id) { return contacts.FirstOrDefault(c => c.Id == id); }
    public void Put(Contact contact) { /* 新增 */ }
    public void Post(Contact contact) { /* 更新 */ }
    public void Delete(string id) { /* 刪除 */ }
}

方法命名對應 HTTP 動詞 (GET/PUT/POST/DELETE)，預設即可對應路由。

路由設定

routes.MapHttpRoute(
    name: "DefaultApi",
    routeTemplate: "api/{controller}/{id}",
    defaults: new { id = RouteParameter.Optional }
);