xhr对象发送GET、POST请求

//1.创建对象
var xhr;
if (window.XMLHttpRequest){//普通浏览器    
	xhr=new XMLHttpRequest();
}else{//老版本IE
	xhr=new ActiveXObject("Microsoft.XMLHTTP");
}
//3.监听服务器响应
xhr.onreadystatechange=function(){
    if(xhr.readyState==4&&xhr.status==200){
          console.log(xhr.responseText);//将接收到的服务器数据显示到控制台中
    }
};
//2.打开链接
xhr.open("请求方式","请求地址",是否异步:默认为异步true);
//3.5 请求头(POST请求时设置)
xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
//4.发送请求
xhr.send();

请求头格式

Accept: text/html,application/xhtml+xml,application/xml;q=0.9,/;q=0.8表示客户端可以接受的内容类型,多个值使用;分号隔开q=0.9 表示权重优先级,/表示可以接受任意类型内容;
Accept-Language: zh-CN,zh;q=0.8,en-US;q=0.5,en;q=0.3表示客户端可以接受的语言
User-Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; Win64x64;浏览器信息,例如使用的是网井的内核, windows64位系统;
Accept-Encoding: gzip, deflate支持的压缩格式
Host: localhost:8888访问地址
Connection: keep-alive保持连接 和HTTP1.1版本有关,默认保持3s
Content-Type: application/x-www-form-urlencoded表单提交时才有可能出现,表示表单的数据类型,使用url编码,url编码 % 16位数
Content-Length: 7post请求 请求体长度
Upgrade-Insecure-Requests: 1告诉服务器,浏览器可以处理https协议、

11.2 请求参数

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
发送GET请求的模板代码: ```javascript function sendGetRequest(url, params, callback) { var xhr = new XMLHttpRequest(); var queryString = ''; // 将参数转换为QueryString形式 if (params) { Object.keys(params).forEach(function(key) { queryString += key + '=' + params[key] + '&'; }); // 去除最后一个'&' queryString = queryString.slice(0, -1); } // 构建完整的URL if (queryString !== '') { url += '?' + queryString; } xhr.open('GET', url, true); xhr.onreadystatechange = function() { if (xhr.readyState === 4 && xhr.status === 200) { // 请求成功,处理返回的数据 var responseData = JSON.parse(xhr.responseText); callback(responseData); } else if (xhr.readyState === 4 && xhr.status !== 200) { // 请求失败,处理错误信息 console.log('请求失败,错误码:' + xhr.status); } }; xhr.send(); } ``` 发送POST请求的模板代码: ```javascript function sendPostRequest(url, data, callback) { var xhr = new XMLHttpRequest(); xhr.open('POST', url, true); xhr.setRequestHeader('Content-Type', 'application/json'); xhr.onreadystatechange = function() { if (xhr.readyState === 4 && xhr.status === 200) { // 请求成功,处理返回的数据 var responseData = JSON.parse(xhr.responseText); callback(responseData); } else if (xhr.readyState === 4 && xhr.status !== 200) { // 请求失败,处理错误信息 console.log('请求失败,错误码:' + xhr.status); } }; xhr.send(JSON.stringify(data)); } ``` 以上两个模板分别用于发送GET和POST请求。在调用时需要传入URL、参数(对于GET请求)或数据(对于POST请求)、回调函数。回调函数用于处理请求成功后返回的数据。需要注意的是,在发送POST请求时,需要将数据转换为JSON字符串,并在请求头中设置Content-Type为application/json。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值