web-dev-qa-db-fra.com

Socket.io + Express + Node + Angular notifications

J'ai une application où j'essaie de créer un système de file d'attente pour les clients. J'essaie de faire en sorte que lorsqu'un client rejoint la file d'attente, il en avise les employés du magasin et leur indique de s'y connecter et d'aider le client le plus rapidement possible.

Je n'arrive pas à convaincre Socket IO de parler avec mon frontal, cependant.

Voici le code que j'ai, et je ne peux même pas obtenir que Node reconnaisse Socket comme une bibliothèque. J'ai suivi 3 tutoriels différents et les ai tous essayés, mais je ne vois pas ce qui se passe de travers dans le code de mon serveur.

Voici ce que je fais sur mon serveur en relation avec Socket.io

var express = require('express');
var app = express();
var io = require('socket.io'); 


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

    socket.emit('connection', "Connection created.")
    console.log("Socket.io is GO");

    socket.on('add customer', function(customer){
        console.log("Customer added", customer); 

    })

    socket.on('notification', function(data) {
        console.log("NEW CUSTOMER IN THE QUEUE", data);
    });

});

Je n'arrive pas à le faire fonctionner sur mon serveur, et lorsqu'il DID est lancé, il ne montre aucun des événements socket.on que j'avais et il ne consomme rien. .

Qu'est-ce que je fais mal? Est-ce que quelqu'un a réussi à faire en sorte que Socket joue bien avec Express et Angular ensemble?

angularjsnode.jsexpresssocket.io
6
Dylan Lott

On dirait que votre code est incomplet ou peut-être que vous n'avez pas bien implémenté.

J'ai créé un exemple en utilisant angular.js, express et socket.io en essayant de répliquer vos besoins.

Ceci est mon serveur, app.js:

var express = require('express');
var app = express();
var server = require('http').Server(app);
var io = require('socket.io')(server);

app.use(express.static(__dirname + '/public'));

io.on('connection', function(socket) {
  console.log('new connection');

  socket.on('add-customer', function(customer) {
    io.emit('notification', {
      message: 'new customer',
      customer: customer
    });
  });
});

server.listen(4041, function() {
  console.log('server up and running at 4041 port');
});

Ensuite, j'ai créé un dossier public avec les fichiers suivants:

public/index.html

<!doctype>
<html ng-app="sampleApp">
  <head>
  </head>

  <body ng-controller="IndexController">
    <label>Please enter your name: </label>
    <input ng-model="currentCustomer.name"/>
    <button ng-click="join()">Join</button>
    <br/>

    <h1>New Customers: </h1>
    <ul>
      <li ng-repeat="customer in newCustomers">{{customer.name}}</li>
    </ul>

    <script src="https://cdn.socket.io/socket.io-1.3.5.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.1/angular.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.1/angular-route.js"></script>
    <script src="app.js"></script>
  </body>

</html>

public/app.js

var app = angular.module('sampleApp', ['ngRoute']);

app.config(['$routeProvider', function($routeProvider) {
  $routeProvider.when('/', {
    templateUrl: '/index.html'
  });
}]);

app.factory('socket', ['$rootScope', function($rootScope) {
  var socket = io.connect();

  return {
    on: function(eventName, callback){
      socket.on(eventName, callback);
    },
    emit: function(eventName, data) {
      socket.emit(eventName, data);
    }
  };
}]);

app.controller('IndexController', function($scope, socket) {
  $scope.newCustomers = [];
  $scope.currentCustomer = {};

  $scope.join = function() {
    socket.emit('add-customer', $scope.currentCustomer);
  };

  socket.on('notification', function(data) {
    $scope.$apply(function () {
      $scope.newCustomers.Push(data.customer);
    });
  });
});
12
Wilson

Vous devez configurer votre serveur socket.io afin qu'il écoute sur un port spécifique. sans l'écoute, il ne peut pas surveiller la connexion des clients et l'envoi de messages. Vous devriez changer votre code comme suit pour résoudre ce problème:

var app = require('express')();
var server = require('http').Server(app);
var io = require('socket.io')(server);

//Existing Code

server.listen(1337, function(){
    console.log('listening on *:1337');
});
1
Blubberguy22