Question

73

Angular-socket-io: how to disconnect the client

rated 0 times [ 79] [ 6] / answers: 1 / hits: 7294 / 10 Years ago, fri, march 7, 2014, 12:00:00

Update

Now the method socket.disconnect(close) has been included in angular-socket-io. It has a Boolean parameter 'close', if true, closes also the underlying connection.

I am using btford/angular-socket-io

What is the correct approach to disconnect the client?

I am trying to implement the following scenario

user login --> connect to socket

user logout --> disconnect from socket

repeat (1) (2)

I succeeded to implement the connect (1) but I am having trouble with the disconnect (2)

This is what I tried: in my Authentication service I have the following

factory('AuthenticationService', function(socketFactory) {

  var mySocket;

  var service = {

      //...

      login: function(credentials) {

          var login = $http.post('/login', credentials);

          return login.then(function(response) {

            service.currentUser = response.data.user;

            if ( service.isAuthenticated() ) {

                // **connect to socket on login** 

                mySocket = socketFactory({ioSocket: io.connect('http://localhost')}); 

            }

            return service.isAuthenticated();

          });       

      },



      logout: function(redirectTo) {

          var logout = $http.get('/logout');

          logout.success(function() {

            service.currentUser = null;

            mySocket.disconnect();       // **disconnect on logout (not working)**

            redirect(redirectTo);

          });

          return logout;

      },

      //...

  };

  return service;

})

mySocket.disconnect();

gives the following error
TypeError: Object # has no method 'disconnect'

mySocket.disconnect() works if instead of

mySocket = socketFactory({ioSocket: io.connect('http://localhost')});

I use

mySocket = io.connect('http://localhost');

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

rocioblancac

Add To Favorites

Follow

Total Points: 699

Total Questions: 96

Total Answers: 108

Location: Libya

Member since Mon, Dec 7, 2020

4 Years ago

rocioblancac questions

1 Angular: Error trying to diff '[object Object]'. Only arrays and iterables are allowed

Mon, Dec 13, 21, 00:00, 3 Years ago

1 Bootstrap multiple file selection - show only first file

Sun, Jul 26, 20, 00:00, 4 Years ago

1 React JS How to disable zoom

Wed, Jul 22, 20, 00:00, 4 Years ago

1 React Native https axios resquest gets Network Error on Android but not iOS

Thu, Jan 16, 20, 00:00, 4 Years ago

1 Color Input in React: The format is #rrggbb where rr, gg, bb are two-digit hexadecimal numbers

Mon, Jan 6, 20, 00:00, 5 Years ago

View All

answered 10 Years ago larrycodys · Accepted Answer

The solution is very simple in fact :

Go edit the socket.js file from the Btford angular-socket module and you'll see :

var wrappedSocket = {



          on: addListener,



          addListener: addListener,







          emit: function (eventName, data, callback) {



            return socket.emit(eventName, data, asyncAngularify(socket, callback));



          },    





          removeListener: function () {



            return socket.removeListener.apply(socket, arguments);



          },







          // when socket.on('someEvent', fn (data) { ... }),



          // call scope.$broadcast('someEvent', data)



          forward: function (events, scope) {



            if (events instanceof Array === false) {



              events = [events];



            }



            if (!scope) {



              scope = defaultScope;



            }



            events.forEach(function (eventName) {



              var prefixedEvent = prefix + eventName;



              var forwardBroadcast = asyncAngularify(socket, function (data) {



                scope.$broadcast(prefixedEvent, data);



              });



              scope.$on('$destroy', function () {



                socket.removeListener(eventName, forwardBroadcast);



              });



              socket.on(eventName, forwardBroadcast);



            });



          }



        };

And then you just add this next to the others functions :

disconnect: function(){



                return socket.disconnect();



              },

And voilà, there you go :)

You should have something like that :

var wrappedSocket = {



          on: addListener,



          addListener: addListener,







          emit: function (eventName, data, callback) {



            return socket.emit(eventName, data, asyncAngularify(socket, callback));



          },







          disconnect: function(){



            return socket.disconnect();



          },







          removeListener: function () {



            return socket.removeListener.apply(socket, arguments);



          },







          // when socket.on('someEvent', fn (data) { ... }),



          // call scope.$broadcast('someEvent', data)



          forward: function (events, scope) {



            if (events instanceof Array === false) {



              events = [events];



            }



            if (!scope) {



              scope = defaultScope;



            }



            events.forEach(function (eventName) {



              var prefixedEvent = prefix + eventName;



              var forwardBroadcast = asyncAngularify(socket, function (data) {



                scope.$broadcast(prefixedEvent, data);



              });



              scope.$on('$destroy', function () {



                socket.removeListener(eventName, forwardBroadcast);



              });



              socket.on(eventName, forwardBroadcast);



            });



          }



        };