跨域实现的方法有好多种:
JSONP
cores
document.domain
window.postMessage()
今天主要分析的是Cores的实现---------------------------------------------------------
cores---Cross-Orgin Resource Sharing,使用自定义的HTTP头部,让服务器声明那些来源是可以通过浏览器访问该服务器上的资源,从而决定请求是成功还是失败。
客户端:
<input type="button" value="测试开始" onclick="crossDomainRequest()"/>
<div id="content"></div>
<script>
var content = document.getElementById('content');
function crossDomainRequest(){
content.innerHTML = '请求开始';
var url = 'http://——————————————————';
//创建ajax对象
if(window.XMLHttpRequest){
var xhr = new XMLHttpRequest();
}else{
var xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
if(xhr){
//建立连接
xhr.open('GET',url,true);
//发送请求
xhr.send();
//预检请求
xhr.setRequestHeader("POWERED-BY-MENGXIANHUI", "Approve");
xhr.setRequestHeader("Content-Type", "application/xml");
//带验证信息请求
xhr.withCredentials = "true";
xhr.onreadystatechange = handler;
}else{
content.innerHTML = '不能创建XHR对象';
}
}
function handler(xhr){
if(xhr.readyState == 4){
if(xhr.status == 200){
var response = xhr.responseText;
content.innerHTML = "请求结果"+response;
}else{
content.innerHTML = "不允许跨域请求";
}
}else{
content.innerHTML = "readyState = "+xhr.readyState;
}
}
</script>
服务器端:
protected void Page_Load(object sender, EventArgs e){
if (Request.HttpMethod.Equals("GET"))
{
Response.Write("这个页面是用来测试跨域 POST 请求的,直接浏览意义不大。");
}
else if (Request.HttpMethod.Equals("OPTIONS"))
{
//通知客户端允许预检请求。并设置缓存时间
Response.ClearContent();
Response.AddHeader("Access-Control-Allow-Origin", "你的地址");
Response.AddHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS");
Response.AddHeader("Access-Control-Allow-Headers", "POWERED-BY-MENGXIANHUI");
Response.AddHeader("Access-Control-Max-Age", "30");
//此过程无需返回数据
Response.End();
}
else if (Request.HttpMethod.Equals("POST"))
{
if (Request.Headers["Origin"].Equals("你的地址"))
{
System.Xml.XmlDocument doc = new System.Xml.XmlDocument();
doc.Load(Request.InputStream);
Response.AddHeader("Access-Control-Allow-Origin", "http://你的地址");
Response.Write("您提交的数据是:<br/><br/>" + Server.HtmlEncode(doc.OuterXml));
}
else
{
Response.Write("不允许你的网站请求。");
}
}
}
Access-Control-Allow-Origin //判断来源
setRequestHeader() //预检请求
withCredentials //带验证信息请求
亿速云「云服务器」,即开即用、新一代英特尔至强铂金CPU、三副本存储NVMe SSD云盘,价格低至29元/月。点击查看>>
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。