目录
前言：
1、创建MVC项目
2、修改返回格式
3、创建【Web API】控制器
4、创建【HttpGet】访问接口
5、创建【HttpPost】访问接口
6、测试接口：
6.1、执行：点击【调试】，【开始执行(步调试)】
6.2、使用【Postman】进行测试（需要自行下载）
6.3、访问路径拼接方式：
6.4、HttpGet请求测试(可以在浏览器中测试即可)
6.5、HttpPost请求测试(必须使用模拟post请求的工具)
7、跨域配置
8、 测试【Ajax】的Get请求
9、测试【Ajax】的Post请求
前言：
本章节主要针对Web API进行基础教学以及强化训练，并对跨域操作做出详细的介绍与添加跨域配置信息，可以通过本文学会创建【跨域接口的编写】，风格采用【restfull】风格
RESTful发展背景及简介 网络应用程序，分为前端和后端两个部分。当前的发展趋势，就是前端设备层出不穷（手机、平板、桌面电脑、其他专用设备…）。因此，必须有一种统一的机制，方便不同的前端设备与后端进行通信。这导致API构架的流行，甚至出现"APIFirst"的设计思想。RESTful API是目前比较成熟的一套互联网应用程序的API设计理论。
REST（Representational State Transfer）表述性状态转换，REST指的是一组架构约束条件和原则。 如果一个架构符合REST的约束条件和原则，我们就称它为RESTful架构。REST本身并没有创造新的技术、组件或服务，而隐藏在RESTful背后的理念就是使用Web的现有特征和能力， 更好地使用现有Web标准中的一些准则和约束。虽然REST本身受Web技术的影响很深， 但是理论上REST架构风格并不是绑定在HTTP上，只不过目前HTTP是唯一与REST相关的实例。
这个世界上只有一种真正的英雄主义： 认清生活的真相，并且仍然热爱它。难道向上攀爬的那条路，不是比站在顶峰更让人心潮澎湃吗？
提供在线jQuery访问地址：【https://code.jquery.com/jquery-3.1.1.min.js】
1、创建MVC项目
依次选择【C#】【Windows】【Web】，下拉至【ASP.NET Web应用程序】并选择，点击【下一步】
输入项目名称，点击【创建】
选择【Web API】，并取消【为HTTPS】配置。点击【创建】
创建效果：
2、修改返回格式
打开【App_Start】文件夹中的【WebApiConfig.cs】文件并添加如下配置：
【 GlobalConfiguration.Configuration.Formatters.XmlFormatter.SupportedMediaTypes.Clear();】
【routeTemplate: "api/{controller}/{action}/{id}",】
3、创建【Web API】控制器
在【Controllers】文件夹上点击【鼠标右键】,选择【控制器】，并依次选择【Web API】【Web API 2 控制器-空】，点击【添加】
添加控制器的名称【Test】，默认后缀【Controller】
创建效果：
4、创建【HttpGet】访问接口
编码如下:
代码语言：javascript复制/// <summary>
/// Get请求接口
/// </summary>
/// <returns></returns>
[HttpGet]
public object GetInfo() {
Dictionary<string, object> map = new Dictionary<string, object>();
map.Add("code",200);
map.Add("message","成功Get请求");
map.Add("result","祝大家功成名就。");
return map;
}编码位置如下:
5、创建【HttpPost】访问接口
编码如下：
代码语言：javascript复制/// <summary>
/// Post请求接口
/// </summary>
/// <returns></returns>
[HttpPost]
public Object GetPostInfo() {
Dictionary<string, object> map = new Dictionary<string, object>();
map.Add("code", 200);
map.Add("message", "成功Post请求");
map.Add("result", "祝大家功成名就。");
return map;
}编码位置如下：
6、测试接口：
6.1、执行：点击【调试】，【开始执行(步调试)】
启动成功：【点击API】
接口地址：
6.2、使用【Postman】进行测试（需要自行下载）
6.3、访问路径拼接方式：
【http://localhost:端口号/api/{控制器名称}/{方法名称}】
6.4、HttpGet请求测试(可以在浏览器中测试即可)
【http://localhost:端口号d/api/Test/GetPostInfohttp://localhost:5833/api/Test/GetPostInfohttp://localhost:5833/api/Test/GetInfohttp://localhost:5833/api/Test/GetPostInfohttp://localhost:端口号d/api/Test/GetPostInfo】
【Postman】访问:
6.5、HttpPost请求测试(必须使用模拟post请求的工具)
必须Postman或其它工具访问：
7、跨域配置
只需要在【Web.config】的 <system.webServer>标签内添加如下编码即可：
代码语言：javascript复制 <httpProtocol>
<customHeaders>
<add name="Access-Control-Allow-Origin" value="*" />
<add name="Access-Control-Allow-Headers" value="*" />
<add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS" />
</customHeaders>
</httpProtocol>
8、 测试【Ajax】的Get请求
HTML代码：
代码语言：javascript复制<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script>
$(document).ready(function () {
$.ajax({
url: "http://localhost:5833/api/Test/GetInfo",
type: "Get",
dataType: "json",
success: function (data) {
document.write(data["code"]);
document.write("<hr/>");
document.write(data["message"]);
document.write("<hr/>");
document.write(data["result"]);
}
});
});
</script>效果：
9、测试【Ajax】的Post请求
HTML编码：
代码语言：javascript复制<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script>
$(document).ready(function () {
$.ajax({
url: "http://localhost:5833/api/Test/GetPostInfo",
type: "Post",
dataType: "json",
success: function (data) {
document.write(data["code"]);
document.write("<hr/>");
document.write(data["message"]);
document.write("<hr/>");
document.write(data["result"]);
}
});
});
</script>效果：
第四章【四、ASP.NET Web API应用程序与跨域操作】完结。
