摘要
cocos creator http请求。在 Cocos Creator 中,我们使用的标准网络接口:
XMLHttpRequest:用于短连接
WebSocket:用于长连接
今天我们说一下短连接的封装。

环境
cocos Creator 引擎2.4.3
编辑工具HBuild X

最终效果
体验一下
在这里插入图片描述
效果图如下,我们获取一个抽奖列表,展示
在这里插入图片描述

在这里插入图片描述

简单示例

	let xhr = new XMLHttpRequest();
 xhr.onreadystatechange = function () {
     if (xhr.readyState == 4 && (xhr.status >= 200 && xhr.status < 400)) {
         var response = xhr.responseText;
         console.log(response);
     }
 };
 xhr.open("GET", url, true);
 xhr.send();

开发者可以直接使用 new XMLHttpRequest() 来创建一个连接对象。

上面的代码并没有封装,下面我们来将代码封一下

封装代码

//短链接请求
cc.http = function(options) {
	return new Promise((resolve, reject) => {
		var xhr = new XMLHttpRequest();
		xhr.onreadystatechange = function() {
			if (xhr.readyState === 4 && (xhr.status >= 200 && xhr.status < 300)) {
				var res = JSON.parse(xhr.responseText);
				resolve(res);
			}
		};
		xhr.timeout = options.timeout || 50000; // 5 seconds for timeout
		var method = options.method || 'GET';
		var url = options.url;
		options.data = options.data || {};
		if (method == 'get' || method == "GET") {
			var url = options.url + '?' + cc.vv.keyObject(options.data);
			xhr.open(method, url, true);
			xhr.send();
		} else {
			xhr.open(method, options.url, true);
			xhr.setRequestHeader("Content-type", "application/json;charset=utf-8");
			xhr.send(JSON.stringify(options.data));
		}
	});
};

上面的封装代码满足get,post的请求

结语:
欢迎加入微信群一起学习讨论!
在这里插入图片描述

Logo

这里是一个专注于游戏开发的社区,我们致力于为广大游戏爱好者提供一个良好的学习和交流平台。我们的专区包含了各大流行引擎的技术博文,涵盖了从入门到进阶的各个阶段,无论你是初学者还是资深开发者,都能在这里找到适合自己的内容。除此之外,我们还会不定期举办游戏开发相关的活动,让大家更好地交流互动。加入我们,一起探索游戏开发的奥秘吧!

更多推荐