ASP.NET MVC Web API 学习笔记---第一个Web API程序

简介: 1. Web API简单说明 近来很多大型的平台都公开了Web API。比如百度地图 Web API,做过地图相关的人都熟悉。公开服务这种方式可以使它易于与各种各样的设备和客户端平台集成功能,以及通过在浏览器中使用 JavaScript来创建更丰富的HTML体验。

1. Web API简单说明

近来很多大型的平台都公开了Web API。比如百度地图 Web API,做过地图相关的人都熟悉。公开服务这种方式可以使它易于与各种各样的设备和客户端平台集成功能,以及通过在浏览器中使用 JavaScript来创建更丰富的HTML体验。所以我相信Web API会越来越有它的用武之地。

说道Web API很多人都会想到Web服务,但是他们仍然有一定的区别:Web API服务是通过一般的 HTTP公开了,而不是通过更正式的服务合同 (如SOAP)

 2. ASP.NET Web API简介

    ASP. NET Web API支持让你能够轻松地创建功能强大的 Web API,可以从范围广泛的客户端 (包括使用 JavaScript从浏览器中,到任何移动/客户端平台上的本机应用程序)访问。它提供以下支持:

 

(1)现代 HTTP 的编程模型:在你的 Web 应用程序中直接访问和处理 HTTP 请求并响应,使用清洁、 强类型的 HTTP 对象模型。除了在服务器上支持这个 HTTP 的编程模型之外,通过使用新的 HttpClient API来从任何.NET 应用程序中调用 Web ApI,我们也支持客户端中相同的编程模型。

(2)内容协商: Web API 有对内容协商的内置支持 这使客户端和服务器一起工作以决定从一个 API 返回的正确的数据格式。我们为JSON、 XML 和Form URL 编码的格式提供默认支持,并可以通过添加你自己的格式化程序来扩展这种支持,或者甚至用你自己的来替换默认的内容协商策略。

(3)查询组成: Web API 通过 OData URL 公约使你能够轻松地支持查询。当你从你的 Web API 返回一种类型的 IQueryable <T> 时,框架将自动为它提供 OData 查询支持 使其易于分页和排序。

(4)模型绑定和验证:模型绑定器提供了一种简单的方法来从HTTP 请求中的不同部分提取数据,并将这些信息部分转换为Web API行为可使用的.NET对象。Web API 支持相同的模型绑定和ASP. NET MVC 现今支持的验证基础结构。

(5)路由: Web ApI 支持完整的路由功能集。现今ASP. NET MVC 和 ASP.NET也支持这一点,包括路线参数和约束。默认情况下,Web API 还提供了智能公约,使你能够轻松地创建实现 Web ApI的类,而无需不得不将属性应用到你的类或方法中。Web API 的配置纯粹是通过代码来实现的 保持你的配置文件干净。

(6)筛选器: Web ApI 使你能够轻松地使用和创建筛选器 (例如: [授权]),那样你能够封装和应用交叉行为。

(7)改进的可测试性: 与其在静态文本对象中设置 HTTP 的详细信息,不如将 Web API 行为与 HttpRequestMessage 和 HttpResponseMessage 一起使用 两个新 的HTTP对象 (在其他内) 使测试更容易。例如,你可以单元测试你的 Web ApI,而无需不得不使用 Mocking 框架。

(8)IoC支持: Web API 支持由 ASP. NET MVC 实现的服务定位器模式,使你能够解决不同设备的依赖。你可以轻松地使用IoC容器或依赖注射架构来集成,以保持干净的依赖解决方案。

   (9)灵活的托管: Web ApI可以托管在任何类型的 ASP.NET应用程序内 (包括这两个基于应用程序的ASP. NET MVC和ASP.NET Web Forms)。我们还设计了 Web API 支持,这样,你还可以选择在你自己的进程内托管/公开它们,如果你不想使用 ASP.NET/IIS 来这样做。至于你如何以及在哪儿使用它,这给了你最大的灵活性。

 

 

 3. 创建一个Web API程序

 启动VS2012创建一个新项目,在已经安装的模板中选择 ASP.NET MVC4 Web API程序

 

在ASP.NET MVC项目对话框中选择Web API项,点击确定 

 

创建成功之后工程中会自动添加一个Web API服务控制器,上面并附带访问地址 

 

项目解决方案,选择Models文件夹右键 添加一个Model类 

 

代码如下: 

namespace Git.Framework.WebAPI.Models
{
     public  class Contact
    {
         public  int ID {  getset; }

         public  string Name {  getset; }

         public  string Sex {  getset; }

         public DateTime Birthday {  getset; }

         public  int Age {  getset; }
    } }

 

 工程解决方案选择Controllers文件夹右键添加一个新的Web API controller

 

 在添加控制器弹出对话框中选择模板: 空API控制器

 

控制器中添加如下代码: 

namespace Git.Framework.WebAPI.Controllers
{
     public  class ContactController : ApiController
    {
        Contact[] contacts =  new Contact[] 
        { 
             new Contact(){ ID= 1, Age= 23, Birthday=Convert.ToDateTime( " 1977-05-30 "), Name= " 情缘 ", Sex= " "},
             new Contact(){ ID= 2, Age= 55, Birthday=Convert.ToDateTime( " 1937-05-30 "), Name= " 令狐冲 ", Sex= " "},
             new Contact(){ ID= 3, Age= 12, Birthday=Convert.ToDateTime( " 1987-05-30 "), Name= " 郭靖 ", Sex= " "},
             new Contact(){ ID= 4, Age= 18, Birthday=Convert.ToDateTime( " 1997-05-30 "), Name= " 黄蓉 ", Sex= " "},
        };

         ///   <summary>
        
///  /api/Contact
        
///   </summary>
        
///   <returns></returns>
         public IEnumerable<Contact> GetListAll()
        {
             return contacts;
        }

         ///   <summary>
        
///  /api/Contact/id
        
///   </summary>
        
///   <param name="id"></param>
        
///   <returns></returns>
         public Contact GetContactByID( int id)
        {
            Contact contact = contacts.FirstOrDefault<Contact>(item=>item.ID==id);
             if (contact ==  null)
            {
                 throw  new HttpResponseException(HttpStatusCode.NotFound);
            }
             return contact;
        }

         ///   <summary>
        
///  根据性别查询
        
///  /api/Contact?sex=女
        
///   </summary>
        
///   <param name="sex"></param>
        
///   <returns></returns>
         public IEnumerable<Contact> GetListBySex( string sex)
        {
             return contacts.Where(item => item.Sex == sex);
        }
    }}

 

4. 浏览器访问API路径

Controller Methed

URI

GetListAll

/api/Contact

GetListBySex

"/api/Contact?sex=" + sex

GetContactByID

/api/Contact/"+id

 

IE浏览器中浏览出现如下效果

 

如果在 Chrome 或者 FireFox 中浏览会先下如下效果

 

 

 

5. Javascript访问Web API

 在项目中添加一个About View视图

 

代码如下:

@{
    Layout = null;
}

<! DOCTYPE html >

< html >
< head >
     < meta  name ="viewport"  content ="width=device-width"   />
     < title >About </ title >
     < script  type ="text/javascript"  src ="/Scripts/jquery-1.7.1.min.js" ></ script >
     < script  type ="text/ecmascript" >
        $(document).ready( function () {
            $("#btnAll").click( function () {
                $.getJSON("/api/Contact",  function (data) {
                     var html = "<ul>";
                    $(data).each( function (i, item) {
                        html += "<li>"+item.ID+":"+item.Name+":"+item.Sex+"</li>";
                    });
                    html += "</ul>";
                    $("#contactAll").html(html);
                });
            });


            $("#btnID").click( function () {
                 var id = $("#txtID").val();
                $.getJSON("/api/Contact/"+id,  function (data) {
                     var html = "<ul>";
                    $(data).each( function (i, item) {
                        html += "<li>" + item.ID + ":" + item.Name + ":" + item.Sex + "</li>";
                    });
                    html += "</ul>";
                    $("#contactID").html(html);
                });
            });

            $("#btnSex").click( function () {
                 var sex = $("#ddlSex").val();
                $.getJSON("/api/Contact?sex=" + sex,  function (data) {
                     var html = "<ul>";
                    $(data).each( function (i, item) {
                        html += "<li>" + item.ID + ":" + item.Name + ":" + item.Sex + "</li>";
                    });
                    html += "</ul>";
                    $("#contactSex").html(html);
                });
            });
        });
     </ script >
</ head >
< body >
     < p >
         < input  type ="button"  id ="btnAll"  value ="查询所有"   /> &nbsp;
     </ p >
     < p >
         < input  type ="text"   id ="txtID"  name ="txtID" />
         < input  type ="button"  id ="btnID"  value ="根据ID查询"   /> &nbsp;
     </ p >
     < p >
         < select  id ="ddlSex"  name ="ddlSex" >
             < option  value ="男" ></ option >
             < option  value ="女" ></ option >
         </ select >
         < input  type ="button"  id ="btnSex"  value ="根据性别查询"   /> &nbsp;
     </ p >
     < div  id ="contactAll" >
     </ div >
     < div  id ="contactID" >
     </ div >
     < div  id ="contactSex" >
     </ div >
</ body >

</html>

 

运行结果效果图

 

 6. Web API总结

      1.Web API 控制器(Controller) 继承ApiController

      2. Api Url Map api/{controller}/{id} 每个"Action"是通过 Http谓词(GET/POST/PUT/DELETE)映射的

3.客户端可以通过 Http Header Accept 指定返回数据的格式。默认是支持:appliction/xml application/json,当想返回比如 image/jpeg 这样的图片格式时,需要添加 MediaTypeFormatter 。比如:当指定某个 Task 时,通过指定 Accept : image/jpeg 获取该 Task 的图片信息。(后面详细介绍)

      该系列大概20篇左右,期待各位的拍砖!

 

 

 

 

 

 

 

相关文章
|
23天前
|
XML JSON API
ServiceStack:不仅仅是一个高性能Web API和微服务框架,更是一站式解决方案——深入解析其多协议支持及简便开发流程,带您体验前所未有的.NET开发效率革命
【10月更文挑战第9天】ServiceStack 是一个高性能的 Web API 和微服务框架,支持 JSON、XML、CSV 等多种数据格式。它简化了 .NET 应用的开发流程,提供了直观的 RESTful 服务构建方式。ServiceStack 支持高并发请求和复杂业务逻辑,安装简单,通过 NuGet 包管理器即可快速集成。示例代码展示了如何创建一个返回当前日期的简单服务,包括定义请求和响应 DTO、实现服务逻辑、配置路由和宿主。ServiceStack 还支持 WebSocket、SignalR 等实时通信协议,具备自动验证、自动过滤器等丰富功能,适合快速搭建高性能、可扩展的服务端应用。
82 3
|
28天前
|
安全 测试技术 数据库
维护的Web应用程序
【10月更文挑战第4天】维护的Web应用程序
44 4
|
8天前
|
数据可视化 数据库 开发者
使用Dash构建交互式Web应用程序
【10月更文挑战第16天】本文介绍了使用Python的Dash框架构建交互式Web应用程序的方法。Dash结合了Flask、React和Plotly等技术,让开发者能够快速创建功能丰富的数据可视化应用。文章从安装Dash开始,逐步介绍了创建简单应用程序、添加交互元素、部署应用程序以及集成更多功能的步骤,并提供了代码示例。通过本文,读者可以掌握使用Dash构建交互式Web应用程序的基本技巧和高级功能。
17 3
|
23天前
|
JavaScript 前端开发
如何使用Vue.js构建响应式Web应用程序
【10月更文挑战第9天】如何使用Vue.js构建响应式Web应用程序
|
23天前
|
前端开发 JavaScript 测试技术
构建响应式Web应用程序:React实战指南
【10月更文挑战第9天】构建响应式Web应用程序:React实战指南
|
28天前
|
存储 JavaScript 前端开发
如何使用React和Redux构建现代化Web应用程序
【10月更文挑战第4天】如何使用React和Redux构建现代化Web应用程序
|
6天前
|
供应链 数据挖掘 API
电商API接口介绍——sku接口概述
商品SKU(Stock Keeping Unit)接口是电商API接口中的一种,专门用于获取商品的SKU信息。SKU是库存量单位,用于区分同一商品的不同规格、颜色、尺寸等属性。通过商品SKU接口,开发者可以获取商品的SKU列表、SKU属性、库存数量等详细信息。
|
7天前
|
JSON API 数据格式
店铺所有商品列表接口json数据格式示例(API接口)
当然,以下是一个示例的JSON数据格式,用于表示一个店铺所有商品列表的API接口响应
|
17天前
|
编解码 监控 API
直播源怎么调用api接口
调用直播源的API接口涉及开通服务、添加域名、获取API密钥、调用API接口、生成推流和拉流地址、配置直播源、开始直播、监控管理及停止直播等步骤。不同云服务平台的具体操作略有差异,但整体流程简单易懂。
|
30天前
|
人工智能 自然语言处理 PyTorch
Text2Video Huggingface Pipeline 文生视频接口和文生视频论文API
文生视频是AI领域热点,很多文生视频的大模型都是基于 Huggingface的 diffusers的text to video的pipeline来开发。国内外也有非常多的优秀产品如Runway AI、Pika AI 、可灵King AI、通义千问、智谱的文生视频模型等等。为了方便调用,这篇博客也尝试了使用 PyPI的text2video的python库的Wrapper类进行调用,下面会给大家介绍一下Huggingface Text to Video Pipeline的调用方式以及使用通用的text2video的python库调用方式。