js脚本发起请求的方式
一、使用XMLHttpRequest发起请求
<script>
console.log("使用XMLHttpRequest发起请求");
var xhr = new XMLHttpRequest();
xhr.open('GET', 'http://ccc.4.dns.snadfml.cn/httptest', true);
//设置请求头
xhr.setRequestHeader("testheader", "123456");
xhr.withCredentials = true;//携带cookie
xhr.send();
//请求成功完成时触发。
xhr.onload = function () {
if (xhr.readyState === xhr.DONE) {
if (xhr.status === 200) {
console.log("响应内容:");
console.log(xhr.response);
console.log(xhr.responseText);
console.log("=========");
//获取响应头
var headers = xhr.getAllResponseHeaders();
console.log("响应头:");
console.log(headers);
console.log("=========");
}else{
console.log(xhr.status);
}
}
};
</script>
二、使用jQuery发起请求
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
<script>
console.log("使用jQuery发起请求");
var obj = {
'username':'124',
'content':'345',
'age':25
};
$.ajax({
type: "POST",// 请求类型
url: "http://ccc.4.dns.snadfml.cn/ajaxtest",// URL
//data: {username:'123',content:'234',age:25},// 参数,拼接在url后面,非json格式请求体
data: JSON.stringify(obj),//这个方法可以把js对象转化为标准json字符串,以json格式发起请求,只能post
contentType:"application/json;charset=UTF-8",//设置请求内容类型
dataType: "json",//响应体结果类型
// 允许请求携带cookie
xhrFields: {
withCredentials: true
},
success: function(data, textStatus, req){// 成功回调
console.log(data);
console.log("响应状态:"+textStatus);
console.log("响应头:");
console.log(req.getAllResponseHeaders());
console.log("响应内容:");
console.log(req.responseText);
},
error: function(){// 错误回调
console.log('出错了..')
},
headers: {// 请求头
c: 3030,
d: 31321
}
});
</script>