创建Web API
引言
在公司中用到的都是webAPI的应用程序,这个东西之前没有接触过。但是这个并不是什么新鲜的东西,因我们
之前有mvc的基础,所以说学习这个东西还是比较容易的,在开始的时候自己可能突然蒙圈了。因为在人家项目中用
到的东西自己之前都没有接触过,感觉非常的陌生甚至整个混乱了。但是当我们静下心来好好想想的话是非常容易
的,就是在某些写法上不太一样,其余的都差不多,下面就给大家创建第一个程序。
创建一个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 { get; set; }
public string Name { get; set; }
public string Sex { get; set; }
public DateTime Birthday { get; set; }
public int Age { get; set; }
} }
工程解决方案选择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);
}
}}
浏览器访问API路径
Controller Methed
URI
GetListAll
/api/Contact
GetListBySex
"/api/Contact?sex=" + sex
GetContactByID
/api/Contact/"+id
在IE浏览器中浏览出现如下效果
如果在Chrome 或者 FireFox 中浏览会先下如下效果
Javascript访问Web API
在项目中添加一个About View视图
代码如下:
- <span style="font-family:SimSun;font-size:18px;">@{
- 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="查询所有" />
- </p>
- <p>
- <input type="text" id="txtID" name="txtID"/>
- <input type="button" id="btnID" value="根据ID查询" />
- </p>
- <p>
- <select id="ddlSex" name="ddlSex">
- <option value="男">男</option>
- <option value="女">女</option>
- </select>
- <input type="button" id="btnSex" value="根据性别查询" />
- </p>
- <div id="contactAll">
- </div>
- <div id="contactID">
- </div>
- <div id="contactSex">
- </div>
- </body>
- </html></span>
<span style="font-family:SimSun;font-size:18px;">@{
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="查询所有" />
</p>
<p>
<input type="text" id="txtID" name="txtID"/>
<input type="button" id="btnID" value="根据ID查询" />
</p>
<p>
<select id="ddlSex" name="ddlSex">
<option value="男">男</option>
<option value="女">女</option>
</select>
<input type="button" id="btnSex" value="根据性别查询" />
</p>
<div id="contactAll">
</div>
<div id="contactID">
</div>
<div id="contactSex">
</div>
</body> </html></span>
运行结果效果图
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 的图片信息。
创建Web API的更多相关文章
- ASP.NET 5系列教程 (六): 在 MVC6 中创建 Web API
ASP.NET 5.0 的主要目标之一是统一MVC 和 Web API 框架应用. 接下来几篇文章中您会了解以下内容: ASP.NET MVC 6 中创建简单的web API. 如何从空的项目模板中启 ...
- 如何在Mvc 6 中创建 Web Api以及如何脱离IIS实现自我托管
微软推出的Asp.net vNext(asp.net 5.0)的其中的一个目标就是统一mvc 和web api 的框架.接下来我就演示一下一下几个内容 1,怎么在Asp.net mvc 6 中创建简单 ...
- 【ASP.NET Web API教程】2.4 创建Web API的帮助页面
原文:[ASP.NET Web API教程]2.4 创建Web API的帮助页面 注:本文是[ASP.NET Web API系列教程]的一部分,如果您是第一次看本博客文章,请先看前面的内容. 2.4 ...
- 在 MVC6 中创建 Web API
ASP.NET 5系列教程 (六): 在 MVC6 中创建 Web API ASP.NET 5.0 的主要目标之一是统一MVC 和 Web API 框架应用. 接下来几篇文章中您会了解以下内容: ...
- Mvc 6 中创建 Web Api
如何在Mvc 6 中创建 Web Api以及如何脱离IIS实现自我托管 微软推出的Asp.net vNext(asp.net 5.0)的其中的一个目标就是统一mvc 和web api 的框架.接下来我 ...
- 使用 ASP.NET Core MVC 创建 Web API(五)
使用 ASP.NET Core MVC 创建 Web API 使用 ASP.NET Core MVC 创建 Web API(一) 使用 ASP.NET Core MVC 创建 Web API(二) 使 ...
- 使用 ASP.NET Core MVC 创建 Web API(一)
从今天开始来学习如何在 ASP.NET Core 中构建 Web API 以及每项功能的最佳适用场景.关于此次示例的数据库创建请参考<学习ASP.NET Core Razor 编程系列一> ...
- 使用 ASP.NET Core MVC 创建 Web API(二)
使用 ASP.NET Core MVC 创建 Web API 使用 ASP.NET Core MVC 创建 Web API(一) 六.添加数据库上下文 数据库上下文是使用Entity Framewor ...
- 使用 ASP.NET Core MVC 创建 Web API(三)
使用 ASP.NET Core MVC 创建 Web API 使用 ASP.NET Core MVC 创建 Web API(一) 使用 ASP.NET Core MVC 创建 Web API(二) 十 ...
- 使用 ASP.NET Core MVC 创建 Web API(四)
使用 ASP.NET Core MVC 创建 Web API 使用 ASP.NET Core MVC 创建 Web API(一) 使用 ASP.NET Core MVC 创建 Web API(二) 使 ...
随机推荐
- 第一个React程序HelloWorld
一.程序步骤 1.用React.createClass生成组件 2.调用React.render把组件渲染到页面中,dom的操作由react自动完成 二.代码 <!DOCTYPE html> ...
- 计算CRC校验值(CRC16和CRC32)(网络传输检验)
CRC有非常多的模式,我没有全部都做,目前支持 CRC16-Modbus CRC16-X25 CRC32 使用方法 auto data = QByteArray::fromHex( "01 ...
- CentOS 7:如何安装防火墙?
对于纯净版的CentOS 7,您必须手动安装防火墙.但是你就算安装了防火墙还是不能马上运行它,你需要再做一些操作才能让它工作. 在CentOS 7中按照以下步骤来设置防火墙 第一步,通过yum安装sy ...
- Linear Regression
大学时候学物理实验的时候接触过线性回归,现在忘记了...还得重新拾起来.学习不扎实耽误了多少时光... sigh Suppose that you time a program as a functi ...
- CentOS软件安装目录查找
注:一般的软件的默认安装目录在/usr/local或者/opt里,可以到那里去找找. 指令名称:whereis 功能介绍:在特定目录中查找符合条件的文件.这些文件的烈性应属于原始代码,二进制文件,或是 ...
- Android addRule()
布局中有很多特殊的属性,通常在载入布局之前,在相关的xml文件中进行静态设置即可. 但是,在有些情况下,我们需要动态设置布局的属性,在不同的条件下设置不同的布局排列方式,这时候就需要用到 Relati ...
- Create Entity Data Model
http://www.entityframeworktutorial.net/EntityFramework5/create-dbcontext-in-entity-framework5.aspx 官 ...
- maven3实战之仓库(快照版本)
maven3实战之仓库(快照版本) ---------- 在Maven的世界中,任何一个项目或者构件都必须有自己的版本.版本的值可能是1.0.0,1.3-alpha-4,2.0,2.1-SNAPSHO ...
- poj1961Period(next数组)
http://poj.org/problem?id=1961 对于next数组只能说略懂,其中精髓还是未完全领会 大体是本串相同前缀与后缀的最大长度,读不懂?看串abcdab 这里所说前缀与后缀都为a ...
- MoreLinq和Linq
MoreLinq里的Batch和Partition不知道什么区别. var ints =Enumerable.Range(1,10); var result = ints.Batch(3); var ...