Socket io socket won't carry jwt token in angular factory - angularjs

Question

I am trying socket.io authorization with jwt in my MEAN stack project. I have problem about socket object won't carry jwt token after I log out and relog in.
when I log in , token will store in local storage
UsersSvc.login($scope.user).success(function(data){
if (data.success) {
store.set('jwt', data.token);
}
then angular socket factory will retrieve jwt from local storage and send to server
.factory('SocketSvc',[ 'store',
function (store) {
this.initSocket = function(){
return io.connect('http://localhost:3000',{ query : 'token=' + store.get('jwt')});
};
var socket = this.initSocket();
return {
on: function (eventName, callback) {
socket.on(eventName, function () {
var args = arguments;
$rootScope.$apply(function () {
callback.apply(socket, args);
});
});
},
emit: function (eventName, data, callback) {
socket.emit(eventName, data, function () {
var args = arguments;
$rootScope.$apply(function () {
if (callback) {
callback.apply(socket, args);
}
});
})
},
};
however; after I logged out
$scope.logout = function(){
var account = UsersSvc.currentAccount();
SocketSvc.emit('logout', { account : account});
$state.go('anon.login');
};
then jwt toke will be remove from local storage
if (toState.name == "anon.login") {
store.remove('jwt');
when I log in agin, token in socket query is gone while you logged in successfully. I am dealing with this problems several days. I don't know what happened.
The only way let server get token again is that refresh the page agin manually.
or close the tab and open a new page then log in agin.
My assumption is the problem of angular factory since it is singleton that it's can't be modified.
I don't know it is right or wrong or how to solve the problem. If you have any suggestion. please let me know

Answer 1

I solved this by wrapping the initSocket code into a function in the return block
you are right in pointing that token is null as the user is not logged in.
this.initSocket = function(){
return io.connect('http://localhost:3000',{ query : 'token=' + store.get('jwt')});
};
var socket = this.initSocket();
the above should go inside return block and called once in any Controller for initializing the socket with a valid token
My soultion:
angular.module('mean1App')
.factory('socket', function(socketFactory, $rootScope, Auth) {
var socket = null;
return {
socket: socket,
init: function(){
var ioSocket = io.connect('http://localhost:9000', {
// Send auth token on connection, you will need to DI the Auth service above
'query': 'token=' + Auth.getToken(),
path: '/socket.io-client'
});
socket = socketFactory({
ioSocket: ioSocket
});
},
...
...blah
});