Web API 入门指南
Web API是一个比较宽泛的概念。这里我们提到Web API特指ASP.NET Web API。
这篇文章中我们主要介绍Web API的主要功能以及与其他同类型框架的对比,最后通过一些相对复杂的实例展示如何通过Web API构建http服务,同时也展示了Visual Studio构建.net项目的各种强大。
目录
什么是 Web API
为什么要用 Web API
功能简介
Web API vs MVC
Web API vs WCF
Web API 实战 (Web API + MongoDB + knockoutjs)
涉及技术
服务URI Pattern
准备工作
代码实现
什么是 Web API
官方定义如下,强调两个关键点,即可以对接各种客户端(浏览器,移动设备),构建http服务的框架。
ASP.NET Web API is a framework that makes it easy to build HTTP services that reach a broad range of clients, including browsers and mobile devices. ASP.NET Web API is an ideal platform for building RESTful applications on the .NET Framework.
Web API在ASP.NET完整框架中地位如下图,与SignalR一起同为构建Service的框架。Web API负责构建http常规服务,而SingalR主要负责的是构建实时服务,例如股票,聊天室,在线游戏等实时性要求比较高的服务。
为什么要用 Web API
Web API最重要的是可以构建面向各种客户端的服务。另外与WCF REST Service不同在于,Web API利用Http协议的各个方面来表达服务(例如 URI/request response header/caching/versioning/content format),因此就省掉很多配置。
当你遇到以下这些情况的时候,就可以考虑使用Web API了。
- 需要Web Service但是不需要SOAP
- 需要在已有的WCF服务基础上建立non-soap-based http服务
- 只想发布一些简单的Http服务,不想使用相对复杂的WCF配置
- 发布的服务可能会被带宽受限的设备访问
- 希望使用开源框架,关键时候可以自己调试或者自定义一下框架
功能简介
Web API的主要功能
支持基于Http verb (GET, POST, PUT, DELETE)的CRUD (create, retrieve, update, delete)操作
通过不同的http动作表达不同的含义,这样就不需要暴露多个API来支持这些基本操作。
请求的回复通过Http Status Code表达不同含义,并且客户端可以通过Accept header来与服务器协商格式,例如你希望服务器返回JSON格式还是XML格式。
请求的回复格式支持 JSON,XML,并且可以扩展添加其他格式。
原生支持OData。
支持Self-host或者IIS host。
支持大多数MVC功能,例如Routing/Controller/Action Result/Filter/Model Builder/IOC Container/Dependency Injection。
Web API vs MVC
你可能会觉得Web API 与MVC很类似,他们有哪些不同之处呢?先上图,这就是他们最大的不同之处。
详细点说他们的区别,
- MVC主要用来构建网站,既关心数据也关心页面展示,而Web API只关注数据
- Web API支持格式协商,客户端可以通过Accept header通知服务器期望的格式
- Web API支持Self Host,MVC目前不支持
- Web API通过不同的http verb表达不同的动作(CRUD),MVC则通过Action名字表达动作
- Web API内建于ASP.NET System.Web.Http命名空间下,MVC位于System.Web.Mvc命名空间下,因此model binding/filter/routing等功能有所不同
- 最后,Web API非常适合构建移动客户端服务
Web API 实战 (Web API + MongoDB + knockoutjs)
ASP.NET网站上有很多简单的Web API实例,看看贴图和实例代码你就明白怎么用了。这里我们通过一个稍微复杂一点的实例来展示下Web API的功能。
涉及技术
在我们的实例里面用到了:
- Mongo DB数据库保存数据 (NoSQL, Document Store,跨平台,跨语言)
- Web API提供数据服务
- MVC作数据展示
- Knockoutjs动态绑定客户端数据,这里有一个简单的介绍
服务URI Pattern
准备工作
下载并安装Mongo DB,步骤看这里。
Mongo DB C# driver下载可以在nuget搜索mongocsharpdriver。
如果想本地察看数据库中内容,下载MongoVUE。
Knockoutjs下载可以在nuget搜索knockoutjs。
代码实现
- 创建项目
创建MVC4 Web Application
在Project Template中选择Web API
然后项目就创建成了,Controllers里面有一个ValuesController,是自动生成的一个最简单的Web API Controller。
正如我们前面所说,里面引用的是System.Web.Http命名空间。
2. 创建model
在model里面添加Contact类
代码如下,其中BsonId需要mongocsharpdriver。
public class Contact{[BsonId]public string Id { get; set; }public string Name { get; set; }public string Phone { get; set; }public string Email { get; set; }public DateTime LastModified { get; set; }}
我们需要添加mongosharpdriver。
另外我们需要在Model中添加Repository,Controller通过该类来访问Mongo DB。
public interface IContactRepository { IEnumerable GetAllContacts(); Contact GetContact(string id); Contact AddContact(Contact item); bool RemoveContact(string id); bool UpdateContact(string id, Contact item); }
ContactRepository的完整实现如下,
public class ContactRepository : IContactRepository{MongoServer _server = null;MongoDatabase _database = null;MongoCollection _contacts = null;public ContactRepository(string connection){if (string.IsNullOrWhiteSpace(connection)){connection = "mongodb://localhost:27017";}_server = new MongoClient(connection).GetServer();_database = _server.GetDatabase("Contacts");_contacts = _database.GetCollection("contacts");// Reset database and add some default entries_contacts.RemoveAll();for (int index = 1; index < 5; index++){Contact contact1 = new Contact{Email = string.Format("test{0}@example.com", index),Name = string.Format("test{0}", index),Phone = string.Format("{0}{0}{0} {0}{0}{0} {0}{0}{0}{0}", index)};AddContact(contact1);}}public IEnumerable GetAllContacts(){return _contacts.FindAll();}public Contact GetContact(string id){IMongoQuery query = Query.EQ("_id", id);return _contacts.Find(query).FirstOrDefault();}public Contact AddContact(Contact item){item.Id = ObjectId.GenerateNewId().ToString();item.LastModified = DateTime.UtcNow;_contacts.Insert(item);return item;}public bool RemoveContact(string id){IMongoQuery query = Query.EQ("_id", id);WriteConcernResult result = _contacts.Remove(query);return result.DocumentsAffected == 1;}public bool UpdateContact(string id, Contact item){IMongoQuery query = Query.EQ("_id", id);item.LastModified = DateTime.UtcNow;IMongoUpdate update = Update.Set("Email", item.Email).Set("LastModified", DateTime.UtcNow).Set("Name", item.Name).Set("Phone", item.Phone);WriteConcernResult result = _contacts.Update(query, update);return result.UpdatedExisting;}
}
- 添加Controller
右键Controllers目录选择添加Controller
选择Empty API controller,将Controller命名为ContactsController
添加如下代码,可以看到Controller中的API方法名就是以http verb命名的。
public class ContactsController : ApiController{private static readonly IContactRepository _contacts = new ContactRepository(string.Empty);public IQueryable Get(){return _contacts.GetAllContacts().AsQueryable();}public Contact Get(string id){Contact contact = _contacts.GetContact(id);if (contact == null){throw new HttpResponseException(HttpStatusCode.NotFound);}return contact;}public Contact Post(Contact value){Contact contact = _contacts.AddContact(value);return contact;}public void Put(string id, Contact value){if (!_contacts.UpdateContact(id, value)){throw new HttpResponseException(HttpStatusCode.NotFound);}}public void Delete(string id){if (!_contacts.RemoveContact(id)){throw new HttpResponseException(HttpStatusCode.NotFound);}}
}
- 添加View
首先添加Knockoutjs库,
Knockoutjs通过MVVM模式来实现动态html绑定数据,如下图,其中View-Model是客户端的javascript object保存的model数据。
先打开HomeController,里面添加一个新的Action代码如下,因为我们要在MVC中对于ContactsController添加对应的View。
public ActionResult Admin(){string apiUri = Url.HttpRouteUrl("DefaultApi", new { controller = "contacts", });ViewBag.ApiUrl = new Uri(Request.Url, apiUri).AbsoluteUri.ToString();return View();}
然后右键Admin方法,选择添加View
选择Create strongly-typed view,在model class中选择Contact类。
添加View的完整代码,注意view中我们通过js去访问WebAPI,以及通过动态绑定将数据呈现在网页上。
@model WebAPIDemo.Models.Contact@{ViewBag.Title = "Admin";
}@section Scripts {@Scripts.Render("~/bundles/jqueryval")<script type="text/javascript" src="@Url.Content("~/Scripts/knockout-2.3.0.js")"></script> <script type="text/javascript">function ProductsViewModel() {var self = this;self.products = ko.observableArray();var baseUri = '@ViewBag.ApiUrl';self.create = function (formElement) {// If valid, post the serialized form data to the web api$(formElement).validate();if ($(formElement).valid()) {$.post(baseUri, $(formElement).serialize(), null, "json").done(function (o) { self.products.push(o); });}}self.update = function (product) {$.ajax({ type: "PUT", url: baseUri + '/' + product.Id, data: product });}self.remove = function (product) {// First remove from the server, then from the UI$.ajax({ type: "DELETE", url: baseUri + '/' + product.Id }).done(function () { self.products.remove(product); });}$.getJSON(baseUri, self.products);}$(document).ready(function () {ko.applyBindings(new ProductsViewModel());})</script>
}<h2>Admin</h2>
<div class="content"><div class="float-left"><ul id="update-products" data-bind="foreach: products"><li><div><div class="item">ID</div> <span data-bind="text: $data.Id"></span></div><div><div class="item">Name</div> <input type="text" data-bind="value: $data.Name"/></div> <div><div class="item">Phone</div> <input type="text" data-bind="value: $data.Phone"/></div><div><div class="item">Email</div> <input type="text" data-bind="value: $data.Email"/></div><div><div class="item">Last Modified</div> <span data-bind="text: $data.LastModified"></span></div><div><input type="button" value="Update" data-bind="click: $root.update"/><input type="button" value="Delete Item" data-bind="click: $root.remove"/></div></li></ul></div><div class="float-right"><h2>Add New Product</h2><form id="addProduct" data-bind="submit: create">@Html.ValidationSummary(true)<fieldset><legend>Contact</legend>@Html.EditorForModel()<p><input type="submit" value="Save" /></p></fieldset></form></div>
</div>
接下来在_layout.cshtml中添加一个admin页面的链接如下
<ul id="menu"><li>@Html.ActionLink("Home", "Index", "Home", new { area = "" }, null)</li><li>@Html.ActionLink("API", "Index", "Help", new { area = "" }, null)</li><li>@Html.ActionLink("Admin", "Admin", "Home")</li> </ul>
- 测试与调试
大功告成,直接运行下我们的作品,我们的admin链接也显示在右上角,
Admin页面的样子,Contact list是动态加载进来的,可以通过这个页面做添加,修改,删除的操作。
通过IE network capture来查看请求内容,
重新加载页面,可以看到回复的格式为JSON,
JSON内容就是我们mock的一些数据。
接下来我们修改,删除,又添加了一条记录,可以看到使用了不同的http method。
通过前面安装的mongovue来查看下DB中的数据,先添加的user也在其中,令我感到欣慰。。。
Web API 入门指南相关推荐
- Angular和.NET Core Web API入门应用程序
下载源160.2 KB 您可以在此处查看此项目的源代码和最新更新 这是Angular/.NET Core Web API入门应用程序,具有添加.编辑和删除客户的基本功能,因此您可以将其用作构建应用程序 ...
- web前端入门指南:来看看这位大佬的学习之路吧!
开始他的表演 第一章:为什么要学习前端开发?web前端开发是什么? 从事前端开发工作差不多3年了,自己也从一个什么都不懂的小白积累了一定的理论和实践经验.编写<Web前端入门指南>系列文章 ...
- android 地铁地图api,入门指南-地铁图 JS API | 高德地图API
入门指南将带您迅速了解地铁图 JS API的基本使用,学习如何以easy模式创建地铁简易图,使您在最短时间内创建一个地铁图页面. 准备页面 在正式开始开发地图应用之前,您需要做如下几步: 申请JS A ...
- 【WEB API项目实战干货系列】- WEB API入门(一)
这篇做为这个系列的第一篇,做基本的介绍,有经验的人可以直接跳到第二部分创建 ProductController. 创建 Web API 项目 在这里我们使用VS2013, .NET 4.5.1创建一个 ...
- ASP.NET Web API 入门 (API接口、寄宿方式、HttpClient调用)
一.ASP.NET Web API接口定义 ASP.NET Web API默认实现了Action方法和HTTP方法的映射,Action方法方法名体现了其能处理的请求必须采用的HTTP方法 二.寄宿方式 ...
- ASP.NET Web API入门介绍(一)
随着项目的复杂度越来越高,各种第三方系统的数据交互也越来越频繁,不可避免的就要用到Web API接口,这里Web API是一个比较宽泛的概念.本文提到Web API特指ASP.NET Web API. ...
- 【Web API系列教程】1.1 — ASP.NET Web API入门
前言 HTTP不仅仅服务于web页面,同时也是构建暴露服务和数据的API的强大平台.HTTP有着简单.灵活和无处不在的特点.你能想到的几乎所有平台都包含有一个HTTP库,所以HTTP服务可以遍及广泛的 ...
- Java Web 项目入门指南(http、Servlet、Request、Response、ServletContext、会话技术[cookie、session]、Filter、Listener)
概述 web 服务器.项目.资源概述 web 服务器:可以被浏览器访问到的服务器 常见的 web 服务器: tomcat:中小型的服务器软件,免费开源,支持 JSP 和 Servlet apache ...
- CameraX 曝光补偿 API 入门指南
在移动端发展的过程中,相机设备对于推动移动设备创新起到了举足轻重的作用,而相机曝光则是能够拍摄出非凡品质照片的关键要素.在本文中,我将为大家详解移动端开发者在处理相机曝光时所遇到的挑战.之后我会为大家 ...
最新文章
- 42 Ansible配置
- class类文件结构
- 关于WEB三层架构的思考
- 【HDU - 5492】Find a path(dp,tricks)
- 国内做 3D 渲染和游戏引擎的码农们都在哪里获取技术信息?
- java 风车_Java兴趣编程-转动的大风车
- 2021-08-25
- IOS整体项目层级构建
- Excel POI 导入导出(支持大数据量快速导出)
- 近日,百度《互联网从业人员单身情况调查报告》新鲜出炉,调查人群是日前火了一把的西二旗互联网从业者(转载)
- MIPS指令集及汇编
- PDF软件推荐——Sumatra PDF - imsoft.cnblogs
- Solidity 生成Java类
- 爱快可迅速普及家庭专线?
- 网络统考计算机实机操作,2020年国家开放大学电大考试《计算机应用基础》网络核心课形考网考作业试题及答案(完整版)(42页)-原创力文档...
- OpenCV基础九:滤波与卷积(陆续更新)
- 2.1-2.15笔记
- 家谱树(gentree)
- 最赚钱的十大增值业务
- c51单片机汇编语言语法错误,关于51单片机汇编语言一些注意事项
热门文章
- 微信小游戏游戏圈处理(cocos creator处理)
- 【个人笔记】《知了堂》ajax的get及post请求
- MySQL设计学生选课系统(关系型数据库概论)
- Cisco携Citrix推桌面虚拟化 新终端给力VXI
- 计算机毕业设计Java分时共享办公系统(源码+系统+mysql数据库+lw文档)
- 计算机专业专升本考试科目是什么?
- linux shell遍历文件,Linux_shell脚本_遍历文件夹下所有文件
- 智慧物流打造海尔集团核心竞争力
- 网盘搜索_就用网盘传奇-最有效的百度网盘搜索引擎
- [nlp] NLP下游任务