目前中文方面的资料还比较少,能搜索到的那仅有的几篇相关介绍,也几乎是雷同的,其中C#方面的更是少之又少。
XMLHttpRequest接口是Ajax的根本,而Ajax考虑到安全性的问题,是禁止跨域访问资源的。 也就是说:www.baidu.com的页面无法通过Ajax来调用www.cnblogs.com的资源。
但jQuery的$.ajax()明明就可以跨域访问啊!对,的确是跨了,但那是jsonp(JSON with Padding)!利用 <script> 元素的这个开放策略,网页可以得到从其他来源动态产生的 JSON 资料,而这种使用模式就是所谓的 JSONP。用 JSONP 抓到的资料并不是 JSON,而是任意的JavaScript,用 JavaScript 直译器执行而不是用 JSON 解析器解析。关于jsonp的介绍也很多了,这里不扯。
关于使用以本地代码示例为例:
同样还是两个Web站点,客户端代码如下:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script type="text/javascript">
<script src="jquery-1.8.2.min.js"></script>
<script>
var res=null;
$(function() {
var xhr = new XMLHttpRequest();
xhr.open("POST", "http://localhost:46226/hand.ashx", true);
xhr.onreadystatechange= function() {
res = xhr.responseText;
}
xhr.send();
});
function b_c() {
alert(res);
}
</script>
</head>
<body>
<input type="button" value="跨域" onclick="b_c();" />
</body>
</html>
从客户端可以看出和异步请求没什么变化,对确实没有变化,但需要服务器的配合。
服务器代码如下:
public class hand : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
context.Response.AppendHeader("Access-Control-Allow-Origin", "http://localhost:44860");//也可以为*是任何请求
context.Response.Write("YangYuJie");
context.Response.End();
}
public bool IsReusable
{
get
{
return false;
}
}
}
太不可思议了,简直没有多大的变化。是的
以上的配置的含义是允许<http://localhost:44860>域发起的请求可以获取当前服务器的数据。
当然,如果设置成<*>这样有很大的危险性,恶意站点可能通过XSS攻击我们的服务器。
如果仅支持http://localhost:44860这个站跨域访问,那就:如上面的配置。
效果图如下: