在Web Api中快速实现JSonp
本文翻译自：http://www.codeproject.com/Tips/631685/JSONP-in-ASP-NET-Web-API-Quick-Get-Started
Concept：
同源策略：同源策略是客户端语言中的一个概念，它允许元素获取同一个站点中的资源，请求别的domain中的资源将不会被允许。
跨域资源共享[Cross-origin resource sharing (CORS)]：指的是我们可以通过javascript的Ajax(XMLHttpRequests)请求去访问其他的domain，这种请求通常会被浏览器拒绝，但是我们可以通过一些方法来时的浏览器允许这项操作，我们称之为CORS。
JSONP：由于安全问题，浏览器不允许跨域的Ajax的实现，JSONP（JavaScript Object Notation with Padding ）是一个从外部的域抓取JSON数据的方式，他会比其他的实现方式(web proxy and IFrame)更优雅。
JSONP (JavaScript Object Notation with Padding) = JSON data padded with JavaScript function name
更多关于JSONP的介绍：
http://www.codeproject.com/Articles/42641/JSON-to-JSONP-Bypass-Same-Origin-Policy
http://en.wikipedia.org/wiki/Cross-origin_resource_sharing
Implimentation：
1、创建两个项目：WebApi、WebApp，分别任是webapi、MVC项目；
2、在WebApi项目中(1-5均在此项目中)，利用Nuget安装WebApiContrib.Formatting.Jsonp；
3、在App_Start文件夹添加FormatterConfig类，类的代码如下：
public static void RegisterFormatters(MediaTypeFormatterCollection formatters)
{
var jsonFormatter = formatters.JsonFormatter;
jsonFormatter.SerializerSettings = new JsonSerializerSettings
{
ContractResolver = new CamelCasePropertyNamesContractResolver()
};
// Insert the JSONP formatter in front of the standard JSON formatter.
var jsonpFormatter = new JsonpMediaTypeFormatter(formatters.JsonFormatter);
formatters.Insert(0, jsonpFormatter);
}
4、在App_Start/WebApiConfig.cs中覆盖原来的路由为：
config.Routes.MapHttpRoute(
name: "DefaultApi",
routeTemplate: "api/{controller}/{id}/{format}",
defaults: new { id = RouteParameter.Optional, format = RouteParameter.Optional }
);
5、在global文件中添加一条代码：
FormatterConfig.RegisterFormatters(GlobalConfiguration.Configuration.Formatters);
此时我们已经实现了JSONP了，现在我们来做一个测试：
6、在WebApi项目中的Controller文件夹中添加一个class，代码为：
namespace WebApi.Controllers
{
public class ContactsController:ApiController
{
public IEnumerable<Contact> GetAllContacts()
{
Contact[] contacts = new Contact[]
{
new Contact{ Name="张三", PhoneNo="123", EmailAddress="zhangsan@gmail.com"},
new Contact{ Name="李四", PhoneNo="456", EmailAddress="lisi@gmail.com"},
new Contact{ Name="王五", PhoneNo="789", EmailAddress="wangwu@gmail.com"},
};
return contacts;
}
}
public class Contact
{
public string Name { get; set; }
public string PhoneNo { get; set; }
public string EmailAddress { get; set; }
}
}
7、在WebApp中的某个Action的View中代码为：
<html>
<head>
<title>联系人列表</title>
<script src="../../Scripts/jquery-1.7.1.js"></script>
</head>
<body>
<ul id="contacts"></ul>
<script type="text/javascript">
$(function ()
{
alert("");
$.ajax({
Type : "GET",
url : "http://localhost:57826/api/contacts",
dataType : "jsonp",
success : listContacts
});
});
function listContacts(contacts) {
alert("");
$.each(contacts, function (index, contact) {
var html = "<li><ul>";
html += "<li>Name: " + contact.Name + "</li>";
html += "<li>Phone No:" + contact.PhoneNo + "</li>";
html += "<li>Email Address: " + contact.EmailAddress + "</li>";
html += "</ul>";
$("#contacts").append($(html));
});
}
</script>
</body>
</html>
8、通过WebApp中的页面请求WebApi，最终显示的结果为：
：
在Web Api中快速实现JSonp的更多相关文章
- Web APi之手动实现JSONP或安装配置Cors跨域（七）
前言 照理来说本节也应该讲Web API原理,目前已经探讨完了比较底层的Web API消息处理管道以及Web Host寄宿管道,接下来应该要触及控制器.Action方法,以及过滤器.模型绑定等等,想想 ...
- 在ASP.NET Core Web API中为RESTful服务增加对HAL的支持
HAL(Hypertext Application Language,超文本应用语言)是一种RESTful API的数据格式风格,为RESTful API的设计提供了接口规范,同时也降低了客户端与服务 ...
- Entity Framework 6 Recipes 2nd Edition（9-3）译->找出Web API中发生了什么变化
9-3. 找出Web API中发生了什么变化 问题 想通过基于REST的Web API服务对数据库进行插入,删除和修改对象图,而不必为每个实体类编写单独的更新方法. 此外, 用EF6的Code Fri ...
- ASP.NET Web API中的Controller
虽然通过Visual Studio向导在ASP.NET Web API项目中创建的 Controller类型默认派生与抽象类型ApiController,但是ASP.NET Web API框架本身只要 ...
- Web APi 2.0优点和特点？在Web APi中如何启动Session状态？
前言 曾几何时,微软基于Web服务技术给出最流行的基于XML且以扩展名为.asmx结尾的Web Service,此服务在.NET Framework中风靡一时同时也被.NET业界同仁所青睐,几年后在此 ...
- 在ASP.NET Web API中使用OData
http://www.alixixi.com/program/a/2015063094986.shtml 一.什么是ODataOData是一个开放的数据协议(Open Data Protocol)在A ...
- Web Api中的get传值和post传值
GET 方式 get方式传参 我们一般用于获取数据做条件筛选,也就是 “查” 1.无参 var look = function () { $.ajax({ type: "GET", ...
- WEB API 中HTTP的get、post、put,delete 请求方式
一.WEB API 中HTTP 请求方式的四个主要方法 (GET, PUT, POST, DELETE), 按照下列方式映射为 CURD 操作: 1.POST 用于新建资源,服务端在指定的URI 上创 ...
- 使用ASP.NET Web Api构建基于REST风格的服务实战系列教程【五】——在Web Api中实现Http方法(Put,Post,Delete)
系列导航地址http://www.cnblogs.com/fzrain/p/3490137.html 前言 在Web Api中,我们对资源的CRUD操作都是通过相应的Http方法来实现——Post(新 ...
随机推荐
- python命令行解析工具argparse模块【1】
argpaser是python中很好用的一个命令行解析模块,使用它我们可以很方便的创建用户友好型命令行程序.而且argparse会自动生成帮助信息和错误信息. 一.示例 例如下面的例子,从命令行中获取 ...
- 解决servlet乱码问题
1) request中的中文乱码 a) POST方式提交 在获得提交表单信息之前调用request.setCharactersEncoding("UTF-8"); b) GET方式 ...
- C#调用Java方法
C#调用Java方法(详细实例) 阅读目录 C#调用c++ C#调用JAVA方法 C#可以直接引用C++的DLL和转换JAVA写好的程序.最近由于工作原因接触这方面比较多,根据实际需求,我们通过一个具 ...
- 3，C语言文件读写
这两天看到一个关于文件读写的题目,索性就把相关内容总结下. C语言文件读写,无非是几个读写函数的应用,fopen(),fread(),fwrite()等,下面简单介绍下. 一.fopen() 函数原型 ...
- 转:sublime text快捷键 （很实用的东东）
一个好的编辑器,能大大提高编程的效率.如果能熟知软件的快捷键,那更能让你得心印手.这些内容都是我网上和自己实际使用过程中所收集而来的,在网络上应该也算比较全面的了吧.欢迎大家补充,我也会在以后慢慢添加 ...
- 【学习】leader特别忙工作到晚上11点左右，组员7点左右下班了，作为leader怎么办？
Ø leader先将自己做的事情罗列出来,选出不属于leader当前职责的工作内容. Ø 将不属于leader职责内容的部分授权给组员(承担更多的责任,职责). Ø 授权时,先考察组员的能力和了 ...
- Android项目增加混淆
主要介绍向Android项目中添加混淆功能 增加混淆的原因 提高安全性,增加反编译的难度 减少APK的文件大小 实践 混淆的配置 一般情况下,app module 的 build.gradle 文件默 ...
- Ruby学习： 全局变量 和常量
一.全局变量 ruby中支持全局变量,ruby中的全局变量有如下几个特点: 1)标识符以$开头标记 2)全局变量可以在程序的任何地方加以引用 3)全局变量无需提前进行变量声明.引用尚未初始化的全局变量 ...
- Oracle 11g RAC 环境下单实例非缺省监听及端口配置
如果在Oracle 11g RAC环境下使用dbca创建单实例数据库后,Oracle会自动将其注册到缺省的1521端口及监听器.大多数情况下我们使用的为非缺省监听器以及非缺省的监听端口.而且在Orac ...
- Friendship of Frog(水题)
Friendship of Frog Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/65536 K (Java/Other ...