So verwenden Sie http und WebSocket in CocosCreator

So verwenden Sie http und WebSocket in CocosCreator

CocosCreator Version 2.3.4

1. HttpGET

Bei der Get-Methode fordert der Client die lokale Adresse Port 3000 an und übergibt die Parameter URL und Name. Nach dem Empfang gibt der Server den Namensparameter zurück.

Cocos-Client:

//Zugriffsadresse let url = "http://127.0.0.1:3000/?url=123&name=321";
//Erstelle ein neues HTTP
let xhr = neue XMLHttpRequest();
//Daten empfangen xhr.onreadystatechange = function () {
    wenn (xhr.readyState == 4 && (xhr.status >= 200 && xhr.status < 400)) {
        var Antwort = xhr.AntwortText;
        console.log(Antwort);
    }
};
//Fehlerbehandlung xhr.onerror = function(evt){
    Konsole.log(evt);
}
//Eine Anfrage initialisieren, GET-Methode, echte asynchrone Anfrage xhr.open("GET", url, true);
//Anfrage senden xhr.send();

Um das Testen zu erleichtern, wird mithilfe von nodejs ein einfacher Server auf dem lokalen Computer erstellt. Nach Erhalt des Zugriffs wird der Name-Wert im Anforderungsparameter zurückgegeben.

Nodejs-Server:

var app = erfordern('express')(); 
var http = erfordern('http').Server(App);  
 
 
app.get('/', Funktion(req, res){ 
    //Legen Sie den Domänennamen fest, der domänenübergreifend sein darf. * bedeutet, dass jedem Domänennamen das domänenübergreifende Benutzen gestattet ist. res.header("Access-Control-Allow-Origin","*");
    //Erlaubte Header-Typen res.header("Access-Control-Allow-Headers","content-type");
    //Domänenübergreifend zulässige Anforderungsmethoderes.header("Access-Control-Allow-Methods","DELETE,PUT,POST,GET,OPTIONS");
    res.send(Anforderung.Abfragename); 
}); 
   
http.listen(3000, Funktion(){ 
    console.log('hört auf *:3000'); 
});

Führen Sie den Node.JS-Server aus und führen Sie den Cocos-Code aus.

console.log(Antwort); //Ausgabe ist 321

2. HTTP POST

Der Client fordert den Server mit dem Parameternamen an und der Server gibt den Namen nach Erhalt zurück.

Cocos-Client:

let url = "http://127.0.0.1:3000/";
let xhr = neue XMLHttpRequest();
 
xhr.onreadystatechange = Funktion () {
    wenn (xhr.readyState == 4 && (xhr.status >= 200 && xhr.status < 400)) {
        var Antwort = xhr.AntwortText;
        console.log(Antwort);
    }
};
xhr.onerror = Funktion(evt){
    Konsole.log(evt);
}
xhr.open("POST", URL, wahr);
xhr.setRequestHeader("Inhaltstyp", "Anwendung/x-www-form-urlencoded");
xhr.send("name=123");

Nodejs-Server:

var app = erfordern('express')(); 
var http = erfordern('http').Server(App);  
var Abfragezeichenfolge = erforderlich('Abfragezeichenfolge');
 
 
app.post('/', Funktion(erfordert, res){ 
    //Legen Sie den Domänennamen fest, der domänenübergreifend sein darf. * bedeutet, dass jedem Domänennamen das domänenübergreifende Benutzen gestattet ist. res.header("Access-Control-Allow-Origin","*");
    //Erlaubte Header-Typen res.header("Access-Control-Allow-Headers","content-type");
    //Domänenübergreifend zulässige Anforderungsmethoderes.header("Access-Control-Allow-Methods","DELETE,PUT,POST,GET,OPTIONS");
     
    var body = "";
     
    req.on('Daten', Funktion (Block) {
        body += chunk; //Verwenden Sie unbedingt +=, wenn body=chunk, da favicon.ico angefordert wird, ist body gleich {}
        Konsole.log("Block:",Block);
    });
     
    req.on('Ende', Funktion () {
        body = Abfragezeichenfolge.parse(body);
        Konsole.log("Body:",Body);
        res.send(Text.Name);
    });
}); 
   
http.listen(3000, Funktion(){ 
    console.log('hört auf *:3000'); 
});

Cocos-Ausgabe

console.log(Antwort); //Ausgabe 123

WebSocket

Cocos-Clientcode:

Stellen Sie eine Verbindung zum lokalen Server 127.0.0.1:8001 her, senden Sie nach erfolgreicher Verbindung eine Zeichenfolge und drucken Sie die empfangene Zeichenfolge aus

let ws = neuer WebSocket("ws://127.0.0.1:8001");
ws.onopen = Funktion (Ereignis) {
    console.log("Send Text WS wurde geöffnet.");
};
ws.onmessage = Funktion (Ereignis) {
    console.log("Antworttextnachricht: " + event.data);
};
ws.onerror = Funktion (Ereignis) {
    console.log("Beim Senden von Text ist ein Fehler aufgetreten");
};
ws.onclose = Funktion (Ereignis) {
    console.log("WebSocket-Instanz geschlossen.");
};
 
setzeTimeout(Funktion () {
    wenn (ws.readyState === WebSocket.OPEN) {
        console.log("WebSocket beginnt mit dem Senden von Nachrichten.");
        ws.send("Hallo WebSocket, ich bin eine Textnachricht.");
    }
    anders {
        console.log("WebSocket-Instanz war nicht bereit...");
    }
}, 3000);

Nodejs-Server:

Drucken Sie nach dem erfolgreichen Empfang der Zeichenfolge die empfangenen Daten aus und geben Sie eine Zeichenfolge zurück.

var ws = erfordern("nodejs-websocket");
  
console.log("WebSocket erstellen");
var server = ws.createServer(function(conn){
    console.log("Verbindung erfolgreich");
    conn.on("text", Funktion (Objekt) {
       console.log("Empfangen:",obj);
        conn.send("Nachricht kommt vom Server");     
          
    })
    conn.on("schließen", Funktion (Code, Grund) {
        console.log("Verbindung schließen")
    });
    conn.on("Fehler", Funktion (Code, Grund) {
        console.log("Abnormale Schließung")
    });
}).listen(8001)
console.log("Starten Sie die Erstellung des WebSockets");

Testergebnisse, Client-Browser-Ausgabe:

Ausgabe auf der Node.js-Seite:

4. Transplantieren Sie Egrets http und Websocket nach Cocos

Da Cocos über keine Kapselungstoolklassen verfügt, ist es recht praktisch, http und WebSocket direkt von Egret nach Cocos zu übertragen und dort zu verwenden.

Oben finden Sie den detaillierten Inhalt von Http und WebSocket von Cocos Creator. Weitere Informationen zu Cocos Creator finden Sie in den anderen verwandten Artikeln auf 123WORDPRESS.COM!

Das könnte Sie auch interessieren:
  • Unity3D realisiert die Bewegung des Kameraobjektivs und begrenzt den Winkel
  • Detaillierte Erklärung zur Verwendung mehrerer Timer in CocosCreator
  • CocosCreator - modulares Lernskript
  • So verwenden Sie Verbindungen der Physik-Engine in CocosCreator
  • So verwenden Sie die JSZip-Komprimierung in CocosCreator
  • CocosCreator-Tutorial für den Einstieg: Erstellen Sie Ihr erstes Spiel mit TS
  • Interpretation des CocosCreator-Quellcodes: Engine-Start und Hauptschleife
  • CocosCreator allgemeines Framework-Design Ressourcenmanagement
  • So erstellen Sie eine Liste in CocosCreator
  • Analyse des neuen Ressourcenmanagementsystems von CocosCreator
  • So verwenden Sie cc.follow zur Kameraverfolgung in CocosCreator

<<:  Detaillierte Erklärung der MySQL-Vorkompilierungsfunktion

>>:  So zeigen Sie Anwendungsprotokolle von Docker-Containern an

Artikel empfehlen

Erläuterung, ob im interaktiven Design Paging oder Laden gewählt werden soll

Der Autor dieses Artikels @子木yoyo hat ihn in seine...

Beispiel für einen Fork- und Mutex-Lock-Prozess im Linux-Multithreading

Inhaltsverzeichnis Frage: 1. Erster Versuch 2. Ra...

Javascript verwendet das Integritätsattribut zur Sicherheitsüberprüfung

Inhaltsverzeichnis 1. Dateien mit Skript-Tags imp...

JavaScript implementiert eine einzelne verknüpfte Listenprozessanalyse

Vorwort: Zum Speichern mehrerer Elemente sind Arr...

Unterschiede zwischen diesem Schlüsselwort in NodeJS und Browsern

Vorwort Jeder, der JavaScript gelernt hat, muss s...

Was tun, wenn Sie Ihr Passwort in MySQL 5.7.17 vergessen?

1. Skip-Grant-Tables zur Datei my.ini hinzufügen ...

Was ich beim Aufbau meines eigenen Blogs gelernt habe

<br />In einem Jahr Bloggen habe ich persönl...

So starten Sie die RabbitMq-Software automatisch, wenn CentOS gestartet wird

1. Erstellen Sie ein neues Rabbitmq im Verzeichni...

So stellen Sie Gitlab schnell mit Docker bereit

1. Laden Sie das Gitlab-Image herunter Docker-Pul...

Farbabstimmungstechniken und Effektdarstellung für Beauty- und Styling-Websites

Farbe ist eines der wichtigsten Elemente jeder We...

CSS-Animation kombiniert mit SVG zur Erzeugung eines Energieflusseffekts

Der endgültige Effekt ist wie folgt: Die Animatio...

Detaillierte Erklärung zur Verwendung von $props, $attrs und $listeners in Vue

Inhaltsverzeichnis Hintergrund 1. Dokumentbeschre...