cocos-js Http方式网络请求

(源码在最下面)

网络结构

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

客户端服务器结构网络

客户端服务器结构网络是一种主从结构网络。服务器一般处于等待状态,如果有客户端请求,服务器响应请求,建立连接,提供服务。服务器是被动的,客户端是主动的。

点对点结构网络

点对点结构网络也叫对等结构网络,每个节点之间是对等的。
考虑到跨平台的需要,Cocos2d-JS引擎主要采用C/S结构网络。
客户端服务器应用层最主要采用的是HTTP和HTTPS等传输协议。因此有必要介绍一下HTTP和HTTPS:

HTTP

HTTP是超文本传输协议,Internet的基本协议是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后面。GET方法应该只用在读取数据,如静态图片等数据。
POST方法是向指定资源提交数据,请求服务器进行处理。
GET方法像是使用明信片给别人写信,“信内容”写在外面,接触到的人都可以看到,不安全。
POST方法像是把“信内容”装入到信封中给别人写信,接触到的人都看不到,因此是安全的。

HTTPS

HTTPS即安全产文本传输协议,是超文本传输协议和SSL的组合。提供加密通信及对网络服务器身份的鉴定。
简单地说。HTTPS是HTTP的升级版。与HTTPS的区别是,HTTPS使用https://代替http://,HTTPS使用端口443,而HTTP使用端口80和TCP/IP进行通信。SSL使用40位关键字作为RC4流加密算法。这对于商业信息的加密是合适的。HTTPS和SSL支持使用X.509数字认证。如果需要,用户可以确认发送者是谁。

使用XMLHttpRequest对象开发客户端

在Web前端开发中有一种异步刷新技术-AJAX。
AJAX的核心是JavaScript对象XMLHTTPRequest,该对象在Internet Explore5中首次引入,它是一种支持异步请求的技术。借助于XMLHttpRequest对象可以使用JavaScript语言向服务器提出请求并处理响应。

使用XMLHttpRequest对象

由于在Web中使用XMLHttpRequest对象发出HTTP请求和普遍,Cocos2d-JS引擎对其平台进行了移植。可以在cocos2d-JS JSB本地平台和Cocos2d-html的web平台中使用了XMLHttpRequest对象。
XMLHttpRequest对象中常用的函数和属性如下:
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,要请求的链接url
async,是否为异步请求,该参数可选,默认是true
user,如果该请求需要身份验证,这里指定用户名,无默认值
password,,如果该请求需要身份验证,这里指定密码,无默认值

XML HttpRequest中有5种就绪状态:

1、0:请求没有发出,在调用open()函数之前为该状态
2、1:请求已经建立但还没有发出,在调用send()函数之前为该状态
3、2:请求已经发出正在处理中
4、3:请求已经处理,响应中通常有部分数据可用,但是服务器还没有完成响应
5、4:响应已经完成,可以访问服务器响应并使用它

常见的HTTP状态码如下:

401:表示所访问数据禁止访问
403:表示所访问数据收到保护
404:表示错误的URL请求,表示请求的服务器资源不存在
200:表示一切顺利
如果就绪状态是4而且状态码是200即可处理服务器的数据

这里是GET方式请求

var httpHelper = {};
httpHelper.get = function(url, callback){
    var request = cc.loader.getXMLHttpRequest();
    console.log("Status: Send Get Request to " + url);
    request.open("GET", url, true);

    request.onreadystatechange = function () {
        if (request.readyState == 4 && (request.status >= 200 && request.status <= 207)) {
            var httpStatus = request.statusText;
            var response = request.responseText;
            console.log("Status: Got GET response! " + httpStatus);
            callback(true, request);
        }else{
            callback(false, request);
        }
    };
    request.send();
};

使用如下

var reqUrl = "";
httpHelper.get(reqUrl, function (isSuccess, data) {});

这里是POST方式:

httpHelper.post = function(url,params,callback){  
        var nums = arguments.length  
        if(nums == 2){  
            callback = arguments[1];  
            params = "";  
        }  
        var xhr = cc.loader.getXMLHttpRequest();  
        xhr.open("POST", url);  
        xhr.setRequestHeader("Content-Type","text/plain;charset=UTF-8");  
        xhr.onreadystatechange = function () {  
            if (xhr.readyState == 4 && (xhr.status >= 200 && xhr.status <= 207)) {  
                err = false;  
            }else{  
                err = true;  
            }  
            var response = xhr.responseText;  
            callback(err,response);  
        };  
        xhr.send(params);  
    }  

使用如下:

httpHelper.post("http://127.0.0.1:3000/test","id=1&ids=2", function(err,data){  
 if(err){  
 //错误处理  
 }else{  
 cc.log(data);  
 }  
 }) 

你可能感兴趣的:(Cocos-js)