IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

[Article] Un chat en HTML5 avec les websockets [API HTML5]


Sujet :

JavaScript

  1. #21
    Membre expert
    Avatar de Muchos
    Homme Profil pro
    Enseignant
    Inscrit en
    Décembre 2011
    Messages
    1 700
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 38
    Localisation : France, Ardennes (Champagne Ardenne)

    Informations professionnelles :
    Activité : Enseignant
    Secteur : Arts - Culture

    Informations forums :
    Inscription : Décembre 2011
    Messages : 1 700
    Points : 3 849
    Points
    3 849
    Billets dans le blog
    6
    Par défaut
    Juste une question SVP, comment le mettre en-ligne pour le public, après le transfert de tout les fichiers nécessaire via FTP?
    Tu crois que la page html5 proposée dans le tuto, elle sert à quoi ?

  2. #22
    Inactif
    Inscrit en
    Juillet 2010
    Messages
    29
    Détails du profil
    Informations forums :
    Inscription : Juillet 2010
    Messages : 29
    Points : 1
    Points
    1
    Par défaut
    Citation Envoyé par Muchos Voir le message
    Tu crois que la page html5 proposée dans le tuto, elle sert à quoi ?
    je parle du serveur PHP qui s’exécute en ligne de commande -_-

  3. #23
    Membre à l'essai
    Profil pro
    Inscrit en
    Mai 2002
    Messages
    27
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2002
    Messages : 27
    Points : 18
    Points
    18
    Par défaut
    Bonjour a tous,
    tout d'abord merci pour ce tuto c'est exactement ce que je cherchais!
    TOUTEFOIS, il serait bien de mettre a jour le lien vers le package car celui proposé dans le tuto ne marche pas:

    dans la console js de chrome : erreur : ne trouve pas l'entête du handshaking

    n'etant pas encore familier avec les websockets etc j'ai suivi les conseils de Krozer et le chat tourne

    cependant, j'aimerais savoir comment faire tourner "serveur.php" sous wamp/mamp ou sur un serveur web?

    puis je me contenter de lancer un "php -q serveur.php" en me placant dans le rep htdocs de Mamp ?

    merci d'avance pour vos reponses
    Joe.

  4. #24
    Futur Membre du Club
    Profil pro
    Inscrit en
    Mai 2010
    Messages
    10
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2010
    Messages : 10
    Points : 5
    Points
    5
    Par défaut
    Bonjour,

    J'essaye de faire fonctionner le système en mettant le script sur un serveur, donc en enlevant les localhost
    dans serveur.php, je met
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    $master  = WebSocket('192.168.0.25',11345);
    dans le fichier websocket.js, je met
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    var socket = new WebsocketClass('ws://192.168.0.25:11345/serveur.php');
    Question : faut-il mettre juste /serveur.php ou faut-il mettre le chemin complet /test_chat/classes/serveur.php

    Quand je lance la page index.html, j'ai sur la console
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
     
    Resource id #8 CONECTED!
    Requesting handshake...
    GET /serveur.php HTTP/1.1
    Upgrade : websocket
    Connection: Upgrade
    Host: 192.168.0.25:11345
    Origine: http://www.sitelocal.loc
    Sec-WebSocket-Key: <des caractères>
    Sec-WebSocket-Version: 13
    Handshaking...
    HTTP/1.1 101 WebSocket Protocol Handshake
    Upgrade! WebSocket
    Connection: Upgrade
    Sec-WebSocket-Origin: http://www.sitelocal.loc
    Sec-WebSoctet-Location: ws://192.168.0.25/serveur.php
    <des caractères bizarres>
    Done handshaking...
    Resource id #8 DISCONNECTED!
    Et donc ensuite rien ne se passe car visiblement la connexion ne tient pas.

    Que faut-il faire ?
    Merci de votre réponse

  5. #25
    Candidat au Club
    Profil pro
    Inscrit en
    Mars 2010
    Messages
    2
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mars 2010
    Messages : 2
    Points : 2
    Points
    2
    Par défaut joli
    Bonjour,

    Tout d'abord merci pour cet article très interessant.
    J'aurais souhaité savoir si vous auriez des solutions à proposer pour stopper le serveur ?

    Merci,
    Cordialement,
    Emeric

  6. #26
    Futur Membre du Club
    Homme Profil pro
    Inscrit en
    Mars 2012
    Messages
    7
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Belgique

    Informations forums :
    Inscription : Mars 2012
    Messages : 7
    Points : 5
    Points
    5
    Par défaut
    Bonjour je suis en train d'essayer de créer un chat avec des websocket, j'ai commencer par tester votre tuto, j'ai télécharger le package et j'aurais quelques petites questions:
    *Lorsqu'on lance le serveur via la ligne de commande, une erreur revient sans cesse "Strict standards: only variables should be passed by reference in C:\...\serveur.php on line 18. Est-ce normal ?
    *Comment arrête-on le serveur ? =p
    *Lorsque je lance le fichier html aucun message n’apparaît dans la fenêtre de chat, mais pourtant les log sont correct. Est-ce que cela fonctionne toujours?

    Merci d'avance

  7. #27
    Futur Membre du Club
    Homme Profil pro
    Développeur informatique
    Inscrit en
    Novembre 2012
    Messages
    4
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Loire (Rhône Alpes)

    Informations professionnelles :
    Activité : Développeur informatique
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : Novembre 2012
    Messages : 4
    Points : 5
    Points
    5
    Par défaut
    Salut à tous,
    Merci pour le tuto.
    Pour ceux qui avaient des problèmes avec le chat, regardez le message de Krozer en page 1, tout marche si vous suivez ses explications.

    @X4R01

    *Lorsqu'on lance le serveur via la ligne de commande, une erreur revient sans cesse "Strict standards: only variables should be passed by reference in C:\...\serveur.php on line 18. Est-ce normal ?

    --> remplace la ligne par :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    $write=NULL;
    	  $except=NULL;
          socket_select($changed,$write,$except,NULL);
    *Comment arrête-on le serveur ? =p

    --> tu appuie sur CTRL+C

    *Lorsque je lance le fichier html aucun message n’apparaît dans la fenêtre de chat, mais pourtant les log sont correct. Est-ce que cela fonctionne toujours?

    --> tu lance le serveur, tu lance le client.html, si le serveur te réponds, ça marche. Sinon, non.

  8. #28
    Membre averti

    Homme Profil pro
    Développeur Web
    Inscrit en
    Octobre 2013
    Messages
    182
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Pérou

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Octobre 2013
    Messages : 182
    Points : 375
    Points
    375
    Par défaut juillet 2015 !
    Bonjour tous,

    J'avais pas vu le beau blog que voici. Alors j'ai envoyé un courriel à l'auteur... J'ai fait des grosses modifications et maintenant, pour moi, ça marche suffisamment pour un évaluation des websockets.

    Archive websocket.zip à votre disposition.

    Paul

  9. #29
    Nouveau Candidat au Club
    Homme Profil pro
    Étudiant
    Inscrit en
    Décembre 2015
    Messages
    1
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Paris (Île de France)

    Informations professionnelles :
    Activité : Étudiant
    Secteur : Arts - Culture

    Informations forums :
    Inscription : Décembre 2015
    Messages : 1
    Points : 1
    Points
    1
    Par défaut
    Citation Envoyé par krozer Voir le message
    Bonjour,
    Ça fonctionne, mais j'ai remarqué un bug à la fermeture de l'onglet de FF. Ça envoie un code 0x3e9 qui se fait broadcaster par tous les clients connectés sur le même ws et les déconnecter. La solution temporaire pour le moment c'est de conditionner les messages et sortir de la fonction process si le message est égale au code hexa 3e9.
    ++
    Bonjour,
    Merci pour ces précisions ça m'a beaucoup aidé, concernant ce code 0x3e9 qui déconnecte tous les clients, à quel endroit du code peux-tu l'intercepter pour mettre fin à la fonction process() ?

    J'ai essayé de poser des conditions à plusieurs endroits du code, par exemple dans la fonction process() :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    function process($user, $msg) {
       if($user == "0x3e9"){ return false; }
       else{
            $this->send($user->socket, $msg);
        }
    }
    ou encore d'autres fonctions comme send() ou disconnect(), mais impossible de localiser dans quelle variable ce code d'erreur parvient au script, si quelqu'un a trouvé, ça m'aiderait énormément !

  10. #30
    Membre averti

    Homme Profil pro
    Développeur Web
    Inscrit en
    Octobre 2013
    Messages
    182
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Pérou

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Octobre 2013
    Messages : 182
    Points : 375
    Points
    375
    Par défaut Surprise côté Firefox
    Bonjour,

    J’ai repris le travail dont j’avais placé les sources ici. Je n’ai pas fini, mais je laisserai la nouvelle version plus “peaufinée” (propre ? comprise ?).

    La petite nouveauté (je viens de passer à Firefox 44.0), c’est qu’en plus de traiter le ping-pong, il faut également envoyer des messages pour ne pas que le client (Firefox, donc) s’endorme, et lâche ainsi la connexion. J’ai décidé d’envoyer moi-même un ping tous les 20 pings de FF, sachant que FF s’endort après le 22ᵉ. Pour l’instant, il n’y a que les pings qui surveille le chien de garde du serveur, mais je vérifierai si un message quelconque peut également convenir.

    Il est possible que ces choses soient vraies pour Chrome également, mais dans ce cas, le délais entre pings et celui d’auto déconnexion pour inactivité (l’acquittement des pings n’est pas une activité !) serait vraiment beaucoup plus longs.

    À bientôt.

  11. #31
    Membre averti

    Homme Profil pro
    Développeur Web
    Inscrit en
    Octobre 2013
    Messages
    182
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Pérou

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Octobre 2013
    Messages : 182
    Points : 375
    Points
    375
    Par défaut 0x3e9
    Salut tous,
    Citation Envoyé par pafleloup Voir le message
    …concernant ce code 0x3e9 qui déconnecte tous les clients…
    La doc est fastidieuse, mais facile à lire, bien qu’en anglais. Tout y est ! Mais je n’ai moi-même pas tout lu car c’est tout simplement barbant, mais nécessaire pour ceux qui veulent aller plus loin.

    0x3e9 n’est pas un code, mais les deux caractères (le premier étant EOT de l’ASCII) du message envoyé à la fermeture de la fenêtre ou de l’onglet. La partie intéressante de ce message de fermeture en particulier, mais des messages en général, est ce que j’appele le "header" et composé des 2 à 14 (couramment 2 à 6) premiers caractère du cadre (frame) WS .

    Voici la dernière mouture websocket_v2.zip… Ceci rend plus que confortable l’évaluation des “websockets”.

    Il reste un bug (non rédhibitoire) dans le JS du client, je n’ai pas trouvé, alors à mon tour, je demande de l’aide :
    À L’AIDE, svp :
    Sur Firefox, il y a une erreur "SyntaxError: expected expression, got end of script" et il est montré la ligne <!DOCTYPE html>, mais la page continue de fonctionner, sauf la touche "↵". Même chose pour Chrome "Uncaught SyntaxError: Unexpected token }, mais l’erreur est affichée à un autre endroit <button id=SendM onclick=SendIn()>Envoi</button>. Je n’ai pas trouvé la raison! Je l’ai observé peu de temps après avoir voulu utiliser l’opacité sur le bouton "#SendM". Ceci ne m’est pas arrivé plus tôt, car j’utilise la bibliothèque JQuery la plupart du temps.

    Un renvoi d’ascenseur serait apprécié !

  12. #32
    Candidat au Club
    Homme Profil pro
    Étudiant
    Inscrit en
    Avril 2017
    Messages
    1
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 27
    Localisation : France, Haute Savoie (Rhône Alpes)

    Informations professionnelles :
    Activité : Étudiant
    Secteur : High Tech - Électronique et micro-électronique

    Informations forums :
    Inscription : Avril 2017
    Messages : 1
    Points : 2
    Points
    2
    Par défaut
    Bonjour, merci pour cette belle introduction aux websockets !

    J'ai le même problème que Floysand, je peux lancer le serveur, mais je crois que ce dernier ne fonctionne pas correctement car ce qu'il ecrit avec la fonction console() n'est jamais visible depuis le navigateur.

    Voici ce que me montre la console de commande :

    D:\>cd xampp\htdocs\serversTest\webSocketServer\classes

    D:\xampp\htdocs\serversTest\webSocketServer\classes>php -q serveur.php
    Server Started : 2017-04-26 14:09:31
    Master socket : Resource id #5
    Listening on : localhost port 443

    -------------------------
    Et rien de plus ....



    La page du navigateur quant à elle autorise l’écriture dans les champs de pseudo et de texte, elle réagit en écrivant dans la console du navigateur :
    "websocket init" -> quand on valide
    "websocket message send " -> quand on clic sur ok

    mais à aucun moment elle n'écrit ce que l'utilisateur souhaite dans le chat-content.


    J'ai suivit le parcours des stimulis, on peut suivre ce que font le serveur et la page web jusqu'au handshake, mais n'étant pas très expérimenter en js et en php, je n'en suis pas sûr...

    Avez-vous une idée d'où peut provenir le problème ? et si oui de comment le résoudre ?

    Bien à vous, Sunny_go

  13. #33
    Membre habitué
    Homme Profil pro
    Inscrit en
    Janvier 2011
    Messages
    247
    Détails du profil
    Informations personnelles :
    Sexe : Homme

    Informations forums :
    Inscription : Janvier 2011
    Messages : 247
    Points : 163
    Points
    163
    Par défaut
    Citation Envoyé par Sunny_go Voir le message
    Bonjour, merci pour cette belle introduction aux websockets !

    J'ai le même problème que Floysand, je peux lancer le serveur, mais je crois que ce dernier ne fonctionne pas correctement car ce qu'il ecrit avec la fonction console() n'est jamais visible depuis le navigateur.

    Voici ce que me montre la console de commande :

    D:\>cd xampp\htdocs\serversTest\webSocketServer\classes

    D:\xampp\htdocs\serversTest\webSocketServer\classes>php -q serveur.php
    Server Started : 2017-04-26 14:09:31
    Master socket : Resource id #5
    Listening on : localhost port 443

    -------------------------
    Et rien de plus ....



    La page du navigateur quant à elle autorise l’écriture dans les champs de pseudo et de texte, elle réagit en écrivant dans la console du navigateur :
    "websocket init" -> quand on valide
    "websocket message send " -> quand on clic sur ok

    mais à aucun moment elle n'écrit ce que l'utilisateur souhaite dans le chat-content.


    J'ai suivit le parcours des stimulis, on peut suivre ce que font le serveur et la page web jusqu'au handshake, mais n'étant pas très expérimenter en js et en php, je n'en suis pas sûr...

    Avez-vous une idée d'où peut provenir le problème ? et si oui de comment le résoudre ?

    Bien à vous, Sunny_go
    J'ai eu le même problème, mais tout marche maintenant avec le fichier proposé par Paul_Le_Heros plus haut en page 2

+ Répondre à la discussion
Cette discussion est résolue.
Page 2 sur 2 PremièrePremière 12

Discussions similaires

  1. [HTML 5] Un chat en HTML5 avec les websockets
    Par ornitho13 dans le forum Balisage (X)HTML et validation W3C
    Réponses: 22
    Dernier message: 09/11/2012, 18h14
  2. [Article] Jouons un peu avec les websocket
    Par Bovino dans le forum Général JavaScript
    Réponses: 1
    Dernier message: 05/02/2012, 10h17

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo