- 时间:2020-10-30 06:01 编辑: 来源: 阅读:
- 扫一扫,手机访问
摘要:Apache中配置支持CORS(跨域资源共享)实例
当使用ajax跨域请求时,浏览器报错:XmlHttpRequest error: Origin null is not allowed by Access-Control-Allow-Origin.肯定是跨域的问题,如果用jsonp或者proxy的方式进行修改的话未免需要太大的工程量,所以采用CORS这种比较简单高效的技术。相比JOSP的方式,CORS更为高效。JSONP由于它的原理只能实现GET请求,而CORS支持所有类型的HTTP请求。使用CORS,可以使用普通的ajax实现跨域,这对于前端来说是极大的福音了,这个技术被现在大多数浏览器所普遍支持,因为跨域已经是普遍的要求,浏览器肯定会逐渐流出适当的‘后门'出来专门用以跨域。
[b]浏览器支持情况[/b]
[img]http://files.jb51.net/file_images/article/201501/201512094208613.jpg?201502094216[/img]
经本人测试IE浏览器中IE10及以上才可正常发送请求
1.服务器端对于CORS的支持,是通过设置Access-Control-Allow-Origin来进行的。如果浏览器检测到相应的设置,就可以允许Ajax进行跨域的访问,也就是相应的‘后门'。
设置Apache:Apache需要使用mod_headers模块来激活HTTP头的设置,它默认是激活的。你只需要修改Apache配置文件中的httpd.conf文件:
原始代码
[url=http://jb51.net/]http://jb51.net/[/url]这个域才能跨域访问服务器的API。
[b]httpd.conf中:
[/b]
Header set Access-Control-Allow-Origin http://www.1sucai.cn
[b]php文件中:[/b]
<?php
header("Access-Control-Allow-Origin:http://www.1sucai.cn");
[b]前台代码:
[/b]
<script type="text/javascript">
function createCORSRequest(method, url) {
var xhr = new XMLHttpRequest();
if ("withCredentials" in xhr) {
// 此时即支持CORS的情况
// 检查XMLHttpRequest对象是否有“withCredentials”属性
// “withCredentials”仅存在于XMLHTTPRequest level 2对象里
} else {
// 否则检查是否支持XDomainRequest
// XDomainRequest仅存在于IE中,是IE用于支持CORS请求的方式
xhr = new XDomainRequest();
}
xhr.open(method, url, true);
xhr.send();
xhr.onload = function(){
alert(xhr.responseText);
}
}
createCORSRequest('GET', "http://192.168.1.58/t.php");
</script>