Mixing
How to get the socket-id in Angular using Socket-io.client
In my angular app I am using socket.io-client npm package to make a socket-io communication to another node-server.
I have the following code forthe same.
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import * as io from 'socket.io-client';
@Injectable({
providedIn: 'root'
})
export class DataService {
constructor() { }
private url = 'http://localhost:3000';
private socket;
getLiveData1() {
let observable = new Observable(observer => {
this.socket = io(this.url);
console.log("THIS SOCKET IS:getLiveData1");
this.socket.on('connect', function() {
console.log("on connect:THIS SOCKET IS id is");
console.log(this.socket.id);
console.log(this.socket.socket.id);
});
this.socket.on('message', (data) => {
observer.next(data);
});
return () => {
this.socket.disconnect();
}
})
return observable;
}
I am trying to access the client id only on the connect event.
this.socket.on('connect', function() {
console.log("on connect:THIS SOCKET IS id is");
console.log(this.socket.id);
console.log(this.socket.socket.id);
});
however both the log-statements where i am trying to log the socket-id using : this.socket.id or this.socket.socket.id errors out saying that this.socket is undefined
How can i get the client-side socket-id in this case?
socket.io angular6 client-side
asked Jan 1 at 16:14
Tarun PatelTarun Patel
668
add a comment |
In my angular app I am using socket.io-client npm package to make a socket-io communication to another node-server.
I have the following code forthe same.
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import * as io from 'socket.io-client';
@Injectable({
providedIn: 'root'
})
export class DataService {
constructor() { }
private url = 'http://localhost:3000';
private socket;
getLiveData1() {
let observable = new Observable(observer => {
this.socket = io(this.url);
console.log("THIS SOCKET IS:getLiveData1");
this.socket.on('connect', function() {
console.log("on connect:THIS SOCKET IS id is");
console.log(this.socket.id);
console.log(this.socket.socket.id);
});
this.socket.on('message', (data) => {
observer.next(data);
});
return () => {
this.socket.disconnect();
}
})
return observable;
}
I am trying to access the client id only on the connect event.
this.socket.on('connect', function() {
console.log("on connect:THIS SOCKET IS id is");
console.log(this.socket.id);
console.log(this.socket.socket.id);
});
however both the log-statements where i am trying to log the socket-id using : this.socket.id or this.socket.socket.id errors out saying that this.socket is undefined
How can i get the client-side socket-id in this case?
socket.io angular6 client-side
asked Jan 1 at 16:14
Tarun PatelTarun Patel
668
add a comment |
In my angular app I am using socket.io-client npm package to make a socket-io communication to another node-server.
I have the following code forthe same.
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import * as io from 'socket.io-client';
@Injectable({
providedIn: 'root'
})
export class DataService {
constructor() { }
private url = 'http://localhost:3000';
private socket;
getLiveData1() {
let observable = new Observable(observer => {
this.socket = io(this.url);
console.log("THIS SOCKET IS:getLiveData1");
this.socket.on('connect', function() {
console.log("on connect:THIS SOCKET IS id is");
console.log(this.socket.id);
console.log(this.socket.socket.id);
});
this.socket.on('message', (data) => {
observer.next(data);
});
return () => {
this.socket.disconnect();
}
})
return observable;
}
I am trying to access the client id only on the connect event.
this.socket.on('connect', function() {
console.log("on connect:THIS SOCKET IS id is");
console.log(this.socket.id);
console.log(this.socket.socket.id);
});
however both the log-statements where i am trying to log the socket-id using : this.socket.id or this.socket.socket.id errors out saying that this.socket is undefined
How can i get the client-side socket-id in this case?
socket.io angular6 client-side
asked Jan 1 at 16:14
Tarun PatelTarun Patel
668
In my angular app I am using socket.io-client npm package to make a socket-io communication to another node-server.
I have the following code forthe same.
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import * as io from 'socket.io-client';
@Injectable({
providedIn: 'root'
})
export class DataService {
constructor() { }
private url = 'http://localhost:3000';
private socket;
getLiveData1() {
let observable = new Observable(observer => {
this.socket = io(this.url);
console.log("THIS SOCKET IS:getLiveData1");
this.socket.on('connect', function() {
console.log("on connect:THIS SOCKET IS id is");
console.log(this.socket.id);
console.log(this.socket.socket.id);
});
this.socket.on('message', (data) => {
observer.next(data);
});
return () => {
this.socket.disconnect();
}
})
return observable;
}
I am trying to access the client id only on the connect event.
this.socket.on('connect', function() {
console.log("on connect:THIS SOCKET IS id is");
console.log(this.socket.id);
console.log(this.socket.socket.id);
});
however both the log-statements where i am trying to log the socket-id using : this.socket.id or this.socket.socket.id errors out saying that this.socket is undefined
How can i get the client-side socket-id in this case?
socket.io angular6 client-side
socket.io angular6 client-side
asked Jan 1 at 16:14
Tarun PatelTarun Patel
668
asked Jan 1 at 16:14
Tarun PatelTarun Patel
668
asked Jan 1 at 16:14
Tarun PatelTarun Patel
668
asked Jan 1 at 16:14
Tarun PatelTarun Patel
668
asked Jan 1 at 16:14
Tarun PatelTarun Patel
668
668
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
From docs
https://socket.io/docs/client-api/#socket-id
socket.id
(String)
An unique identifier for the socket session. Set after the connect event is triggered, and updated after the reconnect event.
const socket = io('http://localhost');
console.log(socket.id); // undefined
socket.on('connect', () => {
console.log(socket.id); // 'G5p5...'
});
You doing it right, your problem that you are using es5 function, that doesn't keep this context. Replace it with arrow functions. Or bind context.
this.socket.on('connect', /* arrow function */() => {
console.log("on connect:THIS SOCKET IS id is");
console.log(this.socket.id);
});
answered Jan 2 at 13:37
Maksim RomanenkoMaksim Romanenko
31516
const socket = io('http://localhost'); console.log(socket.id); // undefined socket.on('connect', () => { console.log(socket.id); // this gives a typescript compile tie error saying 'socket' is undefined. if i try to use "this.socket.id" it again gives as undefined. });
– Tarun Patel
Jan 5 at 13:52
Could you add full code snippet. It cannot say 'socket' is 'undefined', because it worked fine with 'socket.on(' - if socket would be undefined it wouldn't manage to call socket.on.
– Maksim Romanenko
Jan 6 at 13:20
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53996969%2fhow-to-get-the-socket-id-in-angular-using-socket-io-client%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
From docs
https://socket.io/docs/client-api/#socket-id
socket.id
(String)
An unique identifier for the socket session. Set after the connect event is triggered, and updated after the reconnect event.
const socket = io('http://localhost');
console.log(socket.id); // undefined
socket.on('connect', () => {
console.log(socket.id); // 'G5p5...'
});
You doing it right, your problem that you are using es5 function, that doesn't keep this context. Replace it with arrow functions. Or bind context.
this.socket.on('connect', /* arrow function */() => {
console.log("on connect:THIS SOCKET IS id is");
console.log(this.socket.id);
});
answered Jan 2 at 13:37
Maksim RomanenkoMaksim Romanenko
31516
const socket = io('http://localhost'); console.log(socket.id); // undefined socket.on('connect', () => { console.log(socket.id); // this gives a typescript compile tie error saying 'socket' is undefined. if i try to use "this.socket.id" it again gives as undefined. });
– Tarun Patel
Jan 5 at 13:52
Could you add full code snippet. It cannot say 'socket' is 'undefined', because it worked fine with 'socket.on(' - if socket would be undefined it wouldn't manage to call socket.on.
– Maksim Romanenko
Jan 6 at 13:20
add a comment |
From docs
https://socket.io/docs/client-api/#socket-id
socket.id
(String)
An unique identifier for the socket session. Set after the connect event is triggered, and updated after the reconnect event.
const socket = io('http://localhost');
console.log(socket.id); // undefined
socket.on('connect', () => {
console.log(socket.id); // 'G5p5...'
});
You doing it right, your problem that you are using es5 function, that doesn't keep this context. Replace it with arrow functions. Or bind context.
this.socket.on('connect', /* arrow function */() => {
console.log("on connect:THIS SOCKET IS id is");
console.log(this.socket.id);
});
answered Jan 2 at 13:37
Maksim RomanenkoMaksim Romanenko
31516
const socket = io('http://localhost'); console.log(socket.id); // undefined socket.on('connect', () => { console.log(socket.id); // this gives a typescript compile tie error saying 'socket' is undefined. if i try to use "this.socket.id" it again gives as undefined. });
– Tarun Patel
Jan 5 at 13:52
Could you add full code snippet. It cannot say 'socket' is 'undefined', because it worked fine with 'socket.on(' - if socket would be undefined it wouldn't manage to call socket.on.
– Maksim Romanenko
Jan 6 at 13:20
add a comment |
From docs
https://socket.io/docs/client-api/#socket-id
socket.id
(String)
An unique identifier for the socket session. Set after the connect event is triggered, and updated after the reconnect event.
const socket = io('http://localhost');
console.log(socket.id); // undefined
socket.on('connect', () => {
console.log(socket.id); // 'G5p5...'
});
You doing it right, your problem that you are using es5 function, that doesn't keep this context. Replace it with arrow functions. Or bind context.
this.socket.on('connect', /* arrow function */() => {
console.log("on connect:THIS SOCKET IS id is");
console.log(this.socket.id);
});
answered Jan 2 at 13:37
Maksim RomanenkoMaksim Romanenko
31516
From docs
https://socket.io/docs/client-api/#socket-id
socket.id
(String)
An unique identifier for the socket session. Set after the connect event is triggered, and updated after the reconnect event.
const socket = io('http://localhost');
console.log(socket.id); // undefined
socket.on('connect', () => {
console.log(socket.id); // 'G5p5...'
});
You doing it right, your problem that you are using es5 function, that doesn't keep this context. Replace it with arrow functions. Or bind context.
this.socket.on('connect', /* arrow function */() => {
console.log("on connect:THIS SOCKET IS id is");
console.log(this.socket.id);
});
answered Jan 2 at 13:37
Maksim RomanenkoMaksim Romanenko
31516
answered Jan 2 at 13:37
Maksim RomanenkoMaksim Romanenko
31516
answered Jan 2 at 13:37
Maksim RomanenkoMaksim Romanenko
31516
answered Jan 2 at 13:37
Maksim RomanenkoMaksim Romanenko
31516
31516
const socket = io('http://localhost'); console.log(socket.id); // undefined socket.on('connect', () => { console.log(socket.id); // this gives a typescript compile tie error saying 'socket' is undefined. if i try to use "this.socket.id" it again gives as undefined. });
– Tarun Patel
Jan 5 at 13:52
Could you add full code snippet. It cannot say 'socket' is 'undefined', because it worked fine with 'socket.on(' - if socket would be undefined it wouldn't manage to call socket.on.
– Maksim Romanenko
Jan 6 at 13:20
add a comment |
const socket = io('http://localhost'); console.log(socket.id); // undefined socket.on('connect', () => { console.log(socket.id); // this gives a typescript compile tie error saying 'socket' is undefined. if i try to use "this.socket.id" it again gives as undefined. });
– Tarun Patel
Jan 5 at 13:52
Could you add full code snippet. It cannot say 'socket' is 'undefined', because it worked fine with 'socket.on(' - if socket would be undefined it wouldn't manage to call socket.on.
– Maksim Romanenko
Jan 6 at 13:20
const socket = io('http://localhost'); console.log(socket.id); // undefined socket.on('connect', () => { console.log(socket.id); // this gives a typescript compile tie error saying 'socket' is undefined. if i try to use "this.socket.id" it again gives as undefined. });– Tarun Patel
Jan 5 at 13:52
const socket = io('http://localhost'); console.log(socket.id); // undefined socket.on('connect', () => { console.log(socket.id); // this gives a typescript compile tie error saying 'socket' is undefined. if i try to use "this.socket.id" it again gives as undefined. });– Tarun Patel
Jan 5 at 13:52
Could you add full code snippet. It cannot say 'socket' is 'undefined', because it worked fine with 'socket.on(' - if socket would be undefined it wouldn't manage to call socket.on.
– Maksim Romanenko
Jan 6 at 13:20
Could you add full code snippet. It cannot say 'socket' is 'undefined', because it worked fine with 'socket.on(' - if socket would be undefined it wouldn't manage to call socket.on.
– Maksim Romanenko
Jan 6 at 13:20
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53996969%2fhow-to-get-the-socket-id-in-angular-using-socket-io-client%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
