cocos-js Http方式网络请求

网络结构

网络结构是网络构建方式,目前流行的有客户端服务器结构(C/S结构)和点对点(P2P)结构网络。

客户端服务器结构(C/S结构)

这种结构又被称为Clicent/Server结构,它是一种主从结构。服务器一直处于等待状态,如果客户端请求,服务器响应请求,建立连接,提供服务。服务器是被动的,客户端是主动的。类似于在豪华餐厅点餐,客人是主动的,服务员是被动的。

点对点结构(P2P结构)

这种结构也叫做对等结构网络,每个节点之间是对等的。网络分布范围比较少,通常在一间办公室或者一个家庭内,适用于移动设备之间的通讯,网络链路层由蓝牙和Wifi实现。类似于在吃豪华自助餐,所有的客人都是对等的。

 

考虑到跨平台的需要,Cocos-JS引擎主要采用C/S网络结构。这种结构主要采用HTTP和HTTPS等传输协议。

 

HTTP

HTTP是超文本传输协议,Interent的基本协议是TCP/IP,目前使用广泛使用的是HTTP、HTTPS、FTP、Archie Gopher等是简历在TCP/IP之上的应用层协议,不同的协议对应不同的应用。

HTTP是一个属于应用层的面向对象的协议,由于其简洁,快速的方式,适用于分布式超文本信息传输。

HTTP定义了8中请求方法,OPTIONS,HEAD,GET,POST,PUT,DELETE,TRACE和CONNECT作为Web服务器,至少需实现GET和HEAD方法,其他方法是可选的。

GET方法是向指定的资源发送请求,发送的信息在URL后面。像是使用明信片给别人写信,“信内容”写在外面,接触到的人都可以看到,不安全。

POST方法是向指定的资源提交数据请求服务器进行处理。像是把“信内容”装入信封寄出去,接触到的人都看不到,因此是安全的。

 

HTTPS

HTTPS是安全的超文本传输协议,是超文本传输协议和SSL加密的结合。提供加密通信对网络服务器身份的鉴定。

HTTPS是HTTP的升级版。与HTTP的区别是,HTTPS使用https://代替http://,HTTPS使用端口443,而HTTP使用端口80和TCP/IP金星通信。SSL使用40位关键字作为RC4流加密算法。这对于商业信息的加密是合适的。

 

使用XMLHttpResquest对象

在web前端开发有一种异步刷新技术AJAX。它的核心技术就是JavaScript对象的XMLHttpResquest,他是一种异步请求技术。

1. open()与服务器连接,创建新的连接请求。

2. send()向服务器发送请求。

3. abort()退出当前请求。

4. readyState属性,提供当前请求的状态,其中4表示准备就绪。

5. status属性,提供当前的HTTP请求状态吗,其中200表示请求成功。

6. responseText属性,服务器返回的响应文本。

7. onreadystatechange属性,设置回调函数。

其中,open和send函数,以及onreadystatechange属性是http请求的关键。

 

open函数有5个参数可以使用。(method,url,async,user,password)

method是指发送请求的类型,一般为GET或POSt

url是指请求的链接

async是否异步请求,该参数可选,默认为true

user如果该请求需要身份认证,这里指定用户名,无默认值

password如果该请求需要身份验证,这里指定密码,无默认值

XMLHttpResquest有5中就绪状态

0:请求没有发出,在调用open()函数之前为改状态

1:请求已经建立但还没有发出,在调用send()函数之前为改状态

2:请求已经发出正在处理中

3:请求已经处理,响应中通常有部分数据可用,但是服务器没有完成响应

4:响应已经完成,可以访问服务器响应并使用它

 

常见的HTTP状态码

401:表示所访问数据禁止访问

403:表示所访问数据受到保护

404:表示错误的URL请求,服务器资源不存在

200:表示请求成功

 

如果就是状态是4,并且状态码是200,表示请求完成可以处理服务器数据

Get请求方式

 1 var XMLHttpResquestGet = function (url, callback) {
 2     var request = cc.loader.getXMLHttpRequest();
 3     request.open("GET", url, true);
 4 
 5     request.onreadystatechange = function () {
 6         //如果就绪状态是4,状态码是200则表示请求成功
 7         if(request.readyState === 4 && request.status === 200) {
 8             try{
 9                 console.log("XMLHttpResquestGet     Status:" + request.statusText);
10                 if(callback) callback(true, request.responseText);
11             }
12             catch (e) {
13                 if(callback) callback(false, e);
14             }
15         }
16         else{
17             if(callback) callback(false, );
18         }
19     };
20     request.send();
21 };

 

POST请求方式

 1 var XMLHttpResquestPost = function (url, params, callback) {
 2     var xhr = cc.loader.getXMLHttpRequest();
 3     xhr.open("POST", url);
 4 
 5     xhr.setRequestHeader("Content-Type", "text/plain;charset=UTF-8");
 6     xhr.onreadystatechange = function () {
 7         //如果就绪状态是4,状态码是200则表示请求成功
 8         if(xhr.readyState === 4 && xhr.status === 200) {
 9             try{
10                 console.log("XMLHttpResquestPost     Status:" + xhr.statusText);
11                 if(callback) callback(true, xhr.responseText);
12             }
13             catch (e) {
14                 if(callback) callback(false, e);
15             }
16         }
17         else{
18             if(callback) callback(false);
19         }
20     };
21     xhr.send(params);
22 };
相关文章
相关标签/搜索