您的位置：首页 > 其它

AJAX 跨域请求 No ‘Access-Control-Allow-Origin’

2018-01-03 16:43 344 查看

最近在项目中用到 AJAX 跨域请求，故整理了一下方法，

需要注意的是Response Headers 信息，不同的 Headers 信息有可能获取方式有所不一样，大家可以尝试一下。

经常出现的错误：

**

No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘null’ is therefore not allowed access. The response had HTTP status code 400.

**

可以在被请求的Response header中加入：

// 指定允许其他域名访问
header('Access-Control-Allow-Origin:*');
// 响应类型
header('Access-Control-Allow-Methods:POST');
// 响应头设置
header('Access-Control-Allow-Headers:x-requested-with,content-type');

POST跨域

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
</head>
<body>
<div id="content">
</div>
<script>
$(function () {
$.ajax({
url:'http://118.190.0.95:8686/BJZWY-SY/CGQ/zTree?cgqbh=00047',
type:'POST',
success: function(data){
var as = JSON.parse(data);
console.log(as);
}
});
});
</script>
</body>
</html>

通过 JSONP 方法实现

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>jQuery实现JSONP</title>
</head>
<body>
<div id="mydiv">
<button id="btn">点击</button>
</div>
</body>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
<script type="text/javascript">
$(function(){
$("#btn").click(function(){

$.ajax({
async : true,
url : "https://api.douban.com/v2/book/search",
type : "GET",
dataType : "jsonp", // 返回的数据类型，设置为JSONP方式
jsonp : 'callback', //指定一个查询参数名称来覆盖默认的 jsonp 回调参数名 callback
jsonpCallback: 'handleResponse', //设置回调函数名
data : {
q : "javascript",
count : 1
},
success: function(response, status, xhr){
console.log('状态为：' + status + ',状态是：' + xhr.statusText);
console.log(response);
}
});
});
});
</script>
</html>

雅虎代理

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<scr
4000
ipt type="text/javascript" src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
</head>
<body>
<div id="content">
</div>
<script>
$(function () {
$.getJSON("http://query.yahooapis.com/v1/public/yql", {
q: "select * from json where url=\"https://api.douban.com/v2/book/search\"",
format: "json"
}, function (data) {
console.log(data)
// console.log(data.query.results.json.data);
//  $("#content").html(data.query.results.json.data.shidu);
});
});
</script>
</body>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： ajax跨域

相关文章推荐

新的分享

章节导航