"Cocos2d-js Basic Teaching (6) encapsulation and use of network layer (weak networking)"

talking about networking, in the game is also a very core module, in the official js-test we can find the Internet part

There are two classes under the Networktest file

Socketiotest.js (Socket Class)

Websockettest.js (WebSocket Class)

These are the use of strong networking type, the official package is very useful, you can read the study;

So it is not complicated to do a network interactive game;

Then let's focus on the use of a weak network;

Examples of weak networking in Js-test are:

Xhrtest.js

This class contains the basic method of using the weak network, and also contains a buffer processing method, then we begin to encapsulate this class

Create a new network folder under the SRC directory;

Create a new Httphelper.js (weak networking Class)

Httphelper.js:

/** * Created by Yangshengjiepro on 15/4/23.*/functionHttp () {var_succcallback =function(){}; var_errcallback =function(){};} Http.prototype.getJSON=function(url,data,callback,errorcallback) {if(typeof(callBack) = = "function"){         This. _succcallback =CallBack; }Else{         This. _succcallback =function(){}    }    if(typeof(errorcallback) = = "function"){         This. _errorcallback =Errorcallback; }    varXmlHttp =NewXMLHttpRequest (); varparams = ""; if(typeof(data) = = "Object"){         for(Keyinchdata) {params+ = (key+ "=" +data[key]+ "&"); }    }Else{params=data; } xmlhttp.open ("POST", URL);    Xmlhttp.send (params); varMe= This; //=================== Ajax CallbacksXmlhttp.onreadystatechange =function() {cc.log (URL+ "" + json.stringify (params) +xmlhttp.responsetext); if(Xmlhttp.readystate = = 4){            if(Xmlhttp.status = = 200) {MLOG.L ("Data:", Xmlhttp.responsetext); varStrdata = ""; if(xmlhttp.responsetext.length>0) {//when the content is empty, there will be "[]"Strdata=Xmlhttp.responsetext;                Me._succcallback (strdata); }Else{MLOG.L ("Nothing, please check the network"); return; }            }            Else{                //Network error handling                if(me._errorcallback) {json.stringify (me._errorcallback);                Me._errorcallback (); }            }        }Else{            //Network error handling            if(me._errorcallback) {me._errorcallback (); }        }    }}

View Code

function (Url,data,callback,errorcallback)

Defines a primary method for Http.prototype. Getjson.

It needs to pass in the URL address, data, successful callback, error callback;

In the method, the var xmlHttp = new XMLHttpRequest () is also affirmed;

xmlHttp to handle the transmission of the network, and callbacks;

xmlHttp. Open ("POST", url);
XmlHttp. Send (params);

We choose the Post method to submit the data of the network;xmlHttp. onreadystatechange To make a data callback.

     if (typeof (callBack) = = "function")        {this. _succcallback = callBack;    } Else {        thisfunction() {}    }    if(typeof ( Errorcallback) = = "function")        {this. _errorcallback = errorcallback;    } 

Defines callback and Errorcallback for successful and failed callback execution methods for message access! Notify us
What do I continue to do after a failure or success?

Then the basic simple package of network layer (combination, in fact, most of the JS is a combination) on completion, we can use this method for network access, but we have to put this method, and then streamline, and then expand, convenient for us to use later, we create a newNetmanager. js This class Netmanager.js:

//Server Interface AddressvarSERVERADDR = "Http://xxx/xxx/xxx";//officially on line//Method of realization of concrete methodvarNetmanager = {    /** * Universal access to data method GetMessage * @param successcallback after successful callback function * @param errorcallback after failure callback function (default is not filled)*/GetMessage:function(data,successcallback) {varHTTP =NewHttp (); varSendData =data; Http.getjson (Serveraddr, SendData, Successcallback,NULL); }};

We define a common method of netmanager.getmessage to get access to our network requests! The parameters are mainly filled with 2,

A data,post requires incoming data, and a successful callback method!

So here's what we'll use to call our weak networking use class:

I have defined a method to get the server time and need to pass a apiid The value of the post data 10000 can be taken to the server time

//Send post data
var senddata = {
apiid:10000
}
Call the network connection method to get the data
Netmanager. getMessage (senddata,function (data) {
Mlog. C ("Data >>", data);
});

Directly call our GetMessage can achieve our network access!!! Look at the output of our call!

Knowledge points in this section source code:

SOURCE Download (Baidu disk)

Create a new project yourself, unzip the downloaded file, copy all the files to your new project directory and all the overlays can run!

"Cocos2d-js Basic Teaching (6) encapsulation and use of network layer (weak networking)"