JeuWeb - Crée ton jeu par navigateur
[Node.js] Utilisation de Socket.IO - Version imprimable

+- JeuWeb - Crée ton jeu par navigateur (https://jeuweb.org)
+-- Forum : Discussions, Aide, Ressources... (https://jeuweb.org/forumdisplay.php?fid=38)
+--- Forum : Programmation, infrastructure (https://jeuweb.org/forumdisplay.php?fid=51)
+--- Sujet : [Node.js] Utilisation de Socket.IO (/showthread.php?tid=5897)

Pages : 1 2 3 4 5

[Node.js] Utilisation de Socket.IO - Maks - 30-12-2011

Bonjour à tous, je viens solliciter votre aide si vous avez déjà eu affaire à Socket.IO Smile

Après avoir installé Node et Socket.IO, j'ai suivi ce tuto : http://www.atinux.fr/2011/08/28/tutoriel-socket-io-debutant

Bref ça fonctionne très bien :

Serveur

var html = require('fs').readFileSync(__dirname+'/app.html');

var app = require('http').createServer(function(req, res){ res.end(html); });

app.listen(8080);

var io = require("socket.io");

var io = io.listen(app);

io.sockets.on('connection', function (socket) {

    socket.emit('faitUneAlerte');

});

Client

<script type="text/javascript" src="/socket.io/socket.io.js"></script>

<script type="text/javascript">

    var socket = io.connect();

    socket.on('faitUneAlerte', function () {

        alert('Je fais une alerte car on m\'a appelé !');

    });

</script>

Seulement après pour l'appliquer à mon projet je coince. Pour le moment j'ai un système basique d'AJAX avec rafraichissement d'une div.

Comment faire en sorte de récupérer la réponse dans la div et surtout récupérer le contenu du fichier.php plutôt qu'un .html ? Pareil pour poster de nouvelles données ?

Merci d'avance Wink



RE: [Node.js] Utilisation de Socket.IO - atra27 - 30-12-2011

Tu sais qu'un service de push, ça fonctionne comme:

J'envoie au serveur une donnée->le serveur la push chez tous les clients du chan->le client récupére et traite.

alors que viens faire ton histoire de "récupérer le contenu du fichier.php plutôt qu'un .html"

Tu cherche a faire quoi exactement au final?

RE: [Node.js] Utilisation de Socket.IO - Maks - 30-12-2011

Mes données sont sur une base donnée en fait donc je cherche à récupérer mes données venant de Mysql ou à en insérer de nouvelles Wink

RE: [Node.js] Utilisation de Socket.IO - quentin01 - 30-12-2011

Qui a dit que Node.JS et Socket.IO sont un système de push ?

Bref, pour ta solution si j'ai bien compris il te faut interpréter du PHP et du HTML ? Il te faudra soit utiliser un module Node.JS ( je n'en connais pas pour du parsage de PHP ), soit faire communiquer Apache avec ton serveur, ce qui en thèorie n'est pas compliqué vu qu'il te faut juste faire une requete HTTP à partir de Node.JS.

Après si tu n'as pas compris la récupération de la réponse, c'est la même chose que ton code actuel sauf que la fonction de callback côté client peut recevoir les données que tu passes en plus à socket.emit. Par exemple :



// Serveur

var html = require('fs').readFileSync(__dirname+'/app.html');

var app = require('http').createServer(function(req, res){ res.end(html); });

app.listen(8080);

var io = require("socket.io");

var io = io.listen(app);

io.sockets.on('connection', function (socket) {

    socket.emit('faitUneAlerte', 'Données transmises au client');

});



// Client 

var socket = io.connect();

socket.on('faitUneAlerte', function (data) {

    alert('Je fais une alerte car on m\'a appelé ! Et je reçois : ' + data);

});

Comme tu le vois ici je fais passer une chaîne de caractère au client. Pour passer des structures plus complexes, les développeurs ont pour habitude de passer du JSON sous forme de chaîne de caractère vu que la plupart des navigateurs intègrent un parser JSON qui permet de ne plus passer par eval pour récupérer le json d'une chaîne de caractère.


EDIT : Je viens de voir que tu voulais récupérer des données à partir de MySQL, tu n'es donc pas obligé de passer par PHP. Le mieux serait de récupérer tes données en JS et faire la génération du contenu aussi en JS. ( Il y a un module pour MySQL dans Node.JS ).

RE: [Node.js] Utilisation de Socket.IO - Maks - 30-12-2011

Merci pour ton aide Quentin.

En effet je débute avec Node.js donc tout rappel même basique m'est utile ^^

En effet pour MySQL, il y a des libraires qui ont l'air pas mal. Mais je me demandais, si j'écris mes requêtes en JS, n'importe qui côté client pourra en voir le détail non ? De plus ça m'oblige à réécrire mes classes PHP en JS :/

L'idée c'était de récupérer le contenu de ma page en PHP dans laquelle sont faites les requêtes. Mais je n'ai peut être pas le bon raisonnement !

RE: [Node.js] Utilisation de Socket.IO - niahoo - 30-12-2011

Node.js c'est côté serveur, pas côté client :p

Sinon node.js n'a pas de système de push intégré ?

RE: [Node.js] Utilisation de Socket.IO - Maks - 30-12-2011

Oui mais on écrit tout de même dans un fichier app.js par exemple qui sera lisible côté client dans ton arborescence, ou alors je n'ai rien compris ? ^^

Ca se présente comme ça : https://github.com/felixge/node-mysql
Le résultat final que je cherche à atteindre niveau gestion des déplacements avec Node.js ^^

http://www.youtube.com/watch?v=BJysWws7qaQ

RE: [Node.js] Utilisation de Socket.IO - quentin01 - 30-12-2011

Côté client ? Tu as du oublier que ton code SERVEUR executé avec Node.JS n'est pas accessible par le client, il ne peut pas en voir le code source vu que tu ne lui donnes pas. Seul ton code côté client ( qui communique avec le serveur ) sera visible par l'utilisateur, or les requêtes MySQL se font avec Node.JS, donc côté serveur.

Après si tu ne veux vraiment pas te passer de PHP pour ça, comme je l'ai dis plus haut il y a moyen de faire une requête HTTP sur Apache pour récupérer la page et en retourner son contenu au client. Exemple :



// Serveur

var html = require('fs').readFileSync(__dirname+'/app.html');

var http = require('http');



var app = http.createServer(function(req, res){ res.end(html); });

app.listen(8080);



var io = require("socket.io");

var io = io.listen(app);



io.sockets.on('connection', function (socket) {

    var options = {

        host: 'localhost',

        port: 80,

        path: '/path/de/ton/fichier/php',

        method: 'GET'

    };



    var req = http.request(options, function(res) {

        res.on('data', function (contents) {

            socket.emit('divContents', contents);

        });

    });



    req.end();

});

La documentation

Edit : Node.JS n'a pas de module de push en natif, mais il doit surement en exister. Concernant app.js tu peux très bien le mettre dans un répértoire protégé ou alors le mettre ailleurs que dans l'arborescence des fichiers de ton site web.

RE: [Node.js] Utilisation de Socket.IO - Maks - 30-12-2011

Merci pour ta réponse ça ressemble à ce que je cherchais, je teste ça tout à l'heure Smile

RE: [Node.js] Utilisation de Socket.IO - Maks - 30-12-2011

Il me renvoie ça :

Code :
{"0":60,"1":63,"2":120,"3":109,"4":108,"5":32,"6":118,"7":101,"8":114,"9":115,"10":105,"11":111,"12":110,"13":61,"14":34,"15":49,"16":46,"17":48,"18":34,"19":32,"20":101,"21":110,"22":99,"23":111,"24":100,"25":105,"26":110,"27":103,"28":61,"29":34,"30":73,"31":83,"32":79,"33":45,"34":56,"35":56,"36":53,"37":57,"38":45,"39":49,"40":34,"41":63,"42":62,"43":13,"44":10,"45":60,"46":33,"47":68,"48":79,"49":67,"50":84,"51":89,"52":80,"53":69,"54":32,"55":104,"56":116,"57":109,"58":108,"59":32,"60":80,"61":85,"62":66,"63":76,"64":73,"65":67,"66":32,"67":34,"68":45,"69":47,"70":47,"71":87,"72":51,"73":67,"74":47,"75":47,"76":68,"77":84,"78":68,"79":32,"80":88,"81":72,"82":84,"83":77,"84":76,"85":32,"86":49,"87":46,"88":48,"89":32,"90":83,"91":116,"92":114,"93":105,"94":99,"95":116,"96":47,"97":47,"98":69,"99":78,"100":34,"101":13,"102":10,"103":32,"104":32,"105":34,"106":104,"107":116,"108":116,"109":112,"110":58,"111":47,"112":47,"113":119,"114":119,"115":119,"116":46,"117":119,"118":51,"119":46,"120":111,"121":114,"122":103,"123":47,"124":84,"125":82,"126":47,"127":120,"128":104,"129":116,"130":109,"131":108,"132":49,"133":47,"134":68,"135":84,"136":68,"137":47,"138":120,"139":104,"140":116,"141":109,"142":108,"143":49,"144":45,"145":115,"146":116,"147":114,"148":105,"149":99,"150":116,"151":46,"152":100,"153":116,"154":100,"155":34,"156":62,"157":13,"158":10,"159":60,"160":104,"161":116,"162":109,"163":108,"164":32,"165":120,"166":109,"167":108,"168":110,"169":115,"170":61,"171":34,"172":104,"173":116,"174":116,"175":112,"176":58,"177":47,"178":47,"179":119,"180":119,"181":119,"182":46,"183":119,"184":51,"185":46,"186":111,"187":114,"188":103,"189":47,"190":49,"191":57,"192":57,"193":57,"194":47,"195":120,"196":104,"197":116,"198":109,"199":108,"200":34,"201":32,"202":108,"203":97,"204":110,"205":103,"206":61,"207":34,"208":101,"209":110,"210":34,"211":32,"212":120,"213":109,"214":108,"215":58,"216":108,"217":97,"218":110,"219":103,"220":61,"221":34,"222":101,"223":110,"224":34,"225":62,"226":13,"227":10,"228":60,"229":104,"230":101,"231":97,"232":100,"233":62,"234":13,"235":10,"236":60,"237":116,"238":105,"239":116,"240":108,"241":101,"242":62,"243":66,"244":97,"245":100,"246":32,"247":114,"248":101,"249":113,"250":117,"251":101,"252":115,"253":116,"254":33,"255":60,"256":47,"257":116,"258":105,"259":116,"260":108,"261":101,"262":62,"263":13,"264":10,"265":60,"266":108,"267":105,"268":110,"269":107,"270":32,"271":114,"272":101,"273":118,"274":61,"275":34,"276":109,"277":97,"278":100,"279":101,"280":34,"281":32,"282":104,"283":114,"284":101,"285":102,"286":61,"287":34,"288":109,"289":97,"290":105,"291":108,"292":116,"293":111,"294":58,"295":97,"296":100,"297":109,"298":105,"299":110,"300":64,"301":49,"302":50,"303":55,"304":46,"305":48,"306":46,"307":48,"308":46,"309":49,"310":34,"311":32,"312":47,"313":62,"314":13,"315":10,"316":60,"317":115,"318":116,"319":121,"320":108,"321":101,"322":32,"323":116,"324":121,"325":112,"326":101,"327":61,"328":34,"329":116,"330":101,"331":120,"332":116,"333":47,"334":99,"335":115,"336":115,"337":34,"338":62,"339":60,"340":33,"341":45,"342":45,"343":47,"344":42,"345":45,"346":45,"347":62,"348":60,"349":33,"350":91,"351":67,"352":68,"353":65,"354":84,"355":65,"356":91,"357":47,"358":42,"359":62,"360":60,"361":33,"362":45,"363":45,"364":42,"365":47,"366":32,"367":13,"368":10,"369":32,"370":32,"371":32,"372":32,"373":98,"374":111,"375":100,"376":121,"377":32,"378":123,"379":32,"380":99,"381":111,"382":108,"383":111,"384":114,"385":58,"386":32,"387":35,"388":48,"389":48,"390":48,"391":48,"392":48,"393":48,"394":59,"395":32,"396":98,"397":97,"398":99,"399":107,"400":103,"401":114,"402":111,"403":117,"404":110,"405":100,"406":45,"407":99,"408":111,"409":108,"410":111,"411":114,"412":58,"413":32,"414":35,"415":70,"416":70,"417":70,"418":70,"419":70,"420":70,"421":59,"422":32,"423":125,"424":13,"425":10,"426":32,"427":32,"428":32,"429":32,"430":97,"431":58,"432":108,"433":105,"434":110,"435":107,"436":32,"437":123,"438":32,"439":99,"440":111,"441":108,"442":111,"443":114,"444":58,"445":32,"446":35,"447":48,"448":48,"449":48,"450":48,"451":67,"452":67,"453":59,"454":32,"455":125,"456":13,"457":10,"458":32,"459":32,"460":32,"461":32,"462":112,"463":44,"464":32,"465":97,"466":100,"467":100,"468":114,"469":101,"470":115,"471":115,"472":32,"473":123,"474":109,"475":97,"476":114,"477":103,"478":105,"479":110,"480":45,"481":108,"482":101,"483":102,"484":116,"485":58,"486":32,"487":51,"488":101,"489":109,"490":59,"491":125,"492":13,"493":10,"494":32,"495":32,"496":32,"497":32,"498":115,"499":112,"500":97,"501":110,"502":32,"503":123,"504":102,"505":111,"506":110,"507":116,"508":45,"509":115,"510":105,"511":122,"512":101,"513":58,"514":32,"515":115,"516":109,"517":97,"518":108,"519":108,"520":101,"521":114,"522":59,"523":125,"524":13,"525":10,"526":47,"527":42,"528":93,"529":93,"530":62,"531":42,"532":47,"533":45,"534":45,"535":62,"536":60,"537":47,"538":115,"539":116,"540":121,"541":108,"542":101,"543":62,"544":13,"545":10,"546":60,"547":47,"548":104,"549":101,"550":97,"551":100,"552":62,"553":13,"554":10,"555":13,"556":10,"557":60,"558":98,"559":111,"560":100,"561":121,"562":62,"563":13,"564":10,"565":60,"566":104,"567":49,"568":62,"569":66,"570":97,"571":100,"572":32,"573":114,"574":101,"575":113,"576":117,"577":101,"578":115,"579":116,"580":33,"581":60,"582":47,"583":104,"584":49,"585":62,"586":13,"587":10,"588":60,"589":112,"590":62,"591":13,"592":10,"593":13,"594":10,"595":13,"596":10,"597":32,"598":32,"599":32,"600":32,"601":89,"602":111,"603":117,"604":114,"605":32,"606":98,"607":114,"608":111,"609":119,"610":115,"611":101,"612":114,"613":32,"614":40,"615":111,"616":114,"617":32,"618":112,"619":114,"620":111,"621":120,"622":121,"623":41,"624":32,"625":115,"626":101,"627":110,"628":116,"629":32,"630":97,"631":32,"632":114,"633":101,"634":113,"635":117,"636":101,"637":115,"638":116,"639":32,"640":116,"641":104,"642":97,"643":116,"644":13,"645":10,"646":32,"647":32,"648":32,"649":32,"650":116,"651":104,"652":105,"653":115,"654":32,"655":115,"656":101,"657":114,"658":118,"659":101,"660":114,"661":32,"662":99,"663":111,"664":117,"665":108,"666":100,"667":32,"668":110,"669":111,"670":116,"671":32,"672":117,"673":110,"674":100,"675":101,"676":114,"677":115,"678":116,"679":97,"680":110,"681":100,"682":46,"683":13,"684":10,"685":13,"686":10,"687":60,"688":47,"689":112,"690":62,"691":13,"692":10,"693":60,"694":112,"695":62,"696":13,"697":10,"698":73,"699":102,"700":32,"701":121,"702":111,"703":117,"704":32,"705":116,"706":104,"707":105,"708":110,"709":107,"710":32,"711":116,"712":104,"713":105,"714":115,"715":32,"716":105,"717":115,"718":32,"719":97,"720":32,"721":115,"722":101,"723":114,"724":118,"725":101,"726":114,"727":32,"728":101,"729":114,"730":114,"731":111,"732":114,"733":44,"734":32,"735":112,"736":108,"737":101,"738":97,"739":115,"740":101,"741":32,"742":99,"743":111,"744":110,"745":116,"746":97,"747":99,"748":116,"749":13,"750":10,"751":116,"752":104,"753":101,"754":32,"755":60,"756":97,"757":32,"758":104,"759":114,"760":101,"761":102,"762":61,"763":34,"764":109,"765":97,"766":105,"767":108,"768":116,"769":111,"770":58,"771":97,"772":100,"773":109,"774":105,"775":110,"776":64,"777":49,"778":50,"779":55,"780":46,"781":48,"782":46,"783":48,"784":46,"785":49,"786":34,"787":62,"788":119,"789":101,"790":98,"791":109,"792":97,"793":115,"794":116,"795":101,"796":114,"797":60,"798":47,"799":97,"800":62,"801":46,"802":13,"803":10,"804":13,"805":10,"806":60,"807":47,"808":112,"809":62,"810":13,"811":10,"812":13,"813":10,"814":60,"815":104,"816":50,"817":62,"818":69,"819":114,"820":114,"821":111,"822":114,"823":32,"824":52,"825":48,"826":48,"827":60,"828":47,"829":104,"830":50,"831":62,"832":13,"833":10,"834":60,"835":97,"836":100,"837":100,"838":114,"839":101,"840":115,"841":115,"842":62,"843":13,"844":10,"845":32,"846":32,"847":60,"848":97,"849":32,"850":104,"851":114,"852":101,"853":102,"854":61,"855":34,"856":47,"857":34,"858":62,"859":108,"860":111,"861":99,"862":97,"863":108,"864":104,"865":111,"866":115,"867":116,"868":60,"869":47,"870":97,"871":62,"872":60,"873":98,"874":114,"875":32,"876":47,"877":62,"878":13,"879":10,"880":32,"881":32,"882":13,"883":10,"884":32,"885":32,"886":60,"887":115,"888":112,"889":97,"890":110,"891":62,"892":49,"893":50,"894":47,"895":51,"896":48,"897":47,"898":49,"899":49,"900":32,"901":49,"902":57,"903":58,"904":50,"905":54,"906":58,"907":48,"908":51,"909":60,"910":98,"911":114,"912":32,"913":47,"914":62,"915":13,"916":10,"917":32,"918":32,"919":65,"920":112,"921":97,"922":99,"923":104,"924":101,"925":47,"926":50,"927":46,"928":50,"929":46,"930":50,"931":49,"932":32,"933":40,"934":87,"935":105,"936":110,"937":51,"938":50,"939":41,"940":32,"941":80,"942":72,"943":80,"944":47,"945":53,"946":46,"947":51,"948":46,"949":56,"950":60,"951":47,"952":115,"953":112,"954":97,"955":110,"956":62,"957":13,"958":10,"959":60,"960":47,"961":97,"962":100,"963":100,"964":114,"965":101,"966":115,"967":115,"968":62,"969":13,"970":10,"971":60,"972":47,"973":98,"974":111,"975":100,"976":121,"977":62,"978":13,"979":10,"980":60,"981":47,"982":104,"983":116,"984":109,"985":108,"986":62,"987":13,"988":10,"989":13,"990":10,"length":991,"parent":{"0":71,"1":69,"2":84,"3":32,"4":47,"5":32,"6":72,"7":84,"8":84,"9":80,"10":47,"11":49,"12":46,"13":49,"14":13,"15":10,"16":72,"17":111,"18":115,"19":116,"20":58,"21":32,"22":49,"23":50,"24":55,"25":46,"26":48,"27":46,"28":48,"29":46,"30":

:cogne:

avec

app.html

Code :
<!DOCTYPE html>
<html>
    <head>
        <script type="text/javascript" src="http://127.0.0.1:8080/socket.io/socket.io.js"></script>
        <script type="text/javascript">
        var socket = io.connect();
        socket.on('divContents', function (data) {
        //console.log(data);
        document.getElementById('event').innerHTML = JSON.stringify(data);
        });

        </script>
    </head>
    <body>
        <div id='event'></div>
    </body>
</html>

app.js

Code :
// Serveur
var html = require('fs').readFileSync(__dirname+'/app.html');
var http = require('http');

var app = http.createServer(function(req, res){ res.end(html); });
app.listen(8080);

var io = require("socket.io");
var io = io.listen(app);

io.sockets.on('connection', function (socket) {
    var options = {
        host: 'localhost',
        port: 80,
        path: 'FUCORE/php/evenement.php',
        method: 'GET'
    };

    var req = http.request(options, function(res) {
        res.on('data', function (contents) {
            socket.emit('divContents', contents);
        });
    });

    req.end();
});

D'ailleurs on est toujours obligé de passer par app.html ?