JS XMLHttpRequest 学习总结

http链接使用XMLHttpRequest,html5之后对XHR重新规范了定义,具体可以参考MDN Web docs / XMLHttpRequest

js中可以通过new XMLHttpRequest()来声明,主要参数有:
onreadystatechange : 属性状态readyState改变后就会回调的函数,用户在这里处理各种状态。
readyState:链接状态在这里插入图片描述
response:返回的正文,如果没有,默认是空字符串,其他类型可以定义,根据reponseType
responseText: 返回一个DOMString,它包含对文本的请求的响应,如果请求不成功或尚未发送,则返回null。
responseType: 返回的正文类型,可以是 ArrayBuffer 、 Blob 、 Document 、 JavaScript Object 或 DOMString 。
responseUrl: 如果URL为空,只读的XMLHttpRequest.responseURL属性返回响应的序列化URL或空字符串。当URL被返回的时候,任何包含在URL # 后面的fragment都会被删除。 responseURL 的值将会是经过任意多次重定向后的最终 URL 。
responseXml: 是一个只读值,它返回一个包含请求检索的HTML或XML的Document,如果请求未成功,尚未发送,或者检索的数据无法正确解析为 XML 或 HTML,则为 null。该响应被解析,就像它是一个 “text / xml” 流。当 responseType 设置为 “document” 并且请求已异步执行时,响应将解析为 “text / html” 流。responseXML 对于任何其他类型的数据以及 data: URLs 为 null。

如果服务器没有明确指出 Content-Type 头是 “text/xml” 还是 “application/xml”,
你可以使用XMLHttpRequest.overrideMimeType() 强制 XMLHttpRequest 解析为 XML.

status:返回网页状态,200~299都是正常状态,404 not found。
statusText: 返回状态对应的文本信息,如果 readyState 为 0 或者 1,那么这是个空字符串。
timeout: 超时的时间,超时并不应该用在一个 document environment 中的同步 XMLHttpRequests 请求中,否则将会抛出一个 InvalidAccessError 类型的错误。当超时发生, timeout 事件将会被触发。

在IE中,超时属性可能只能在调用 open() 方法之后且在调用 send() 方法之前设置。

upload: 用来表示上传的进度。这个对象是不透明的,但是作为一个XMLHttpRequestEventTarget,可以通过对其绑定事件来追踪它的进度。
在这里插入图片描述

下面是实例代码:
一、creator js:

	// netTest.js
	net = {};
	module.exports = net;
	net.sendData = function(url, params) {
		var xhr = cc.loader.getXMLHttpRequest();
		// respones callback
		xhr.onreadystatechange = function() {
			cc.log("connect callback");
			if (xhr.readyState === 4 && (xhr.status >= 200 && xhr.status < 300)) {
				cc.log("respones state success" + xhr.responseText);
			} else {
				cc.log("connect error  " + xhr.statusText);
			}
		};
		xhr.timeout = 5000; // 超时时间,单位毫秒
		xhr.open("POST", url);  // 打开链接,POST/GET
		// xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");  // 设置头信息,必须在open之后,send之前
		xhr.send(params); // 发送,参数可以为null,或者是字符串
	};

二、html+js:

	<script>
		var xhr = new XMLHttpRequest();
		// 其余部分和creator类似了,就不重写了
	</script>
  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值