Hello guys,
I spent the last 3 hours searching the forum for the answer to my problem but could not find it.
What is happening is as follows, I have socket.io service equal to the beetz12 example that several people recommended.
This method is working partially, I can connect to the server and receive the callback of the method on (“connect”), I can also use the “emit” method and send my message. However I have already tested 4 implementations and in none of them have I been able to receive the event callback on “message”. To receive the response from the other user.
Here are the codes for analysis:
@Injectable()
export class SocketService {
socketObserver: any;
socketService: any;
socket: any;
user: any;
data: any = null;
socketHost: string = ‘http://localhost:3000’;
apiUrl: string = ‘’;
constructor( public storage: StorageService,) {
console.log('constructor ');
this.socketService = Observable.create(observer => {
console.log('Observable.create: ' , observer);
this.socketObserver = observer;
});
this.initialize();
}
initialize(){
console.log('initialize ');
this.storage.openSocketChat().then((data) => {
this.socketHost = this.apiUrl + '/?accessToken=' + data;
console.log('this.socketHost: ', this.socketHost);
this.socket = io.connect(this.socketHost);
this.socket.on("connect", (msg) => {
console.log('on connect');
this.socketObserver.next({ category: 'connect', message: 'user connected'});
});
this.socket.on("reconnecting", (msg) => {
console.log('on reconnecting');
});
this.socket.on("reconnect_error", (msg) => {
console.log('on reconnect_error');
});
this.socket.on("reconnect_failed", (msg) => {
console.log('on reconnect_failed');
});
this.socket.on('disconnect', function () {
console.log('user disconnected');
// io.emit('user disconnected');
});
this.socket.on("message", (msg) => {
console.log('Message is Here!!!', msg);
this.socketObserver.next({ category: 'message', message: msg });
}); //end of socket.on('message')
});
}
sendMessage(message: string) {
// console.log('in sendMessage and socket is: ', this.socket);
this.socket.emit('message', message);
//this.socketObserver.next({ category: 'sendMessage', message: message });
}
}
################# Convertion.ts
export class ConversationPage {
//socket: SocketIOClient.Socket;
@ViewChild(‘chatScreen’) chatScreen: any;
users: any ;
writtenMessage: any;
user: any ;
messages = [];
chat:any;
io: any;
socketHost: string;
zone: NgZone;
constructor(public navCtrl: NavController,
public navParams: NavParams,
public storage: StorageService,
public socket: SocketService,
public http: Http) {
console.log('ConversationPageConstructor ');
this.chat = this.navParams.get(‘chat’);
this.user = this.navParams.get(‘user’);
this.messages = [];
this.socketHost = "http://localhost:3000";
this.zone = new NgZone({enableLongStackTrace: false});
//this.chatBox = "";
this.socket.socketService.subscribe(event => {
console.log('message received from server... ', event);
if (event.category === 'message'){
this.zone.run(() => {
this.messages.push(event.message);
this.chatScreen.scrollTo(0, 99999, 0);
});
}
}); //end of subscribe
}
sendMessage(): void {
var msg = {
message: this.writtenMessage,
chatId: this.chat._id
};
//this.messages.push(msg);
/*if(this.io != undefined){
console.log('listening to messages: ' ,msg);
this.io.emit('message', msg);
}*/
if(this.writtenMessage != "";){
this.socket.sendMessage(msg);
//this.messages.push(newMsg);
console.log('emitting: ', msg);
}
this.writtenMessage = "";
}
}
Thanks, for your attention.