Hi, there.
The issue(When on mobile)
When the device is ready socket get connected, everything works fine. When I send message or get some other info using sockets it works fine. But when I send message from the browser to the device it doesn’t deliver, But when i send message from the device to the browser it gets delivered.
I have tried several steps to debug this, but couldn’t come up with any useful info.
This several steps include:
-
showing an alert when the socket connects( Works, which shows the socket connection on mobile is connecting)
-
showing an alert when a message is received from socket which doesn’t work.
Below is my code
In app.component.ts I have this piece of code which fires when app is ready
import { SocketProvider } from "../providers/socket/socket";
//Some other imports
constructor(private socket: SocketProvider,){
//Some codes runs here.
}
this.data.currentUser((user) => {
if (user) {
this.socket.connect(user.user).subscribe((io) => {
this.socket.listenIncomingMessage();//Init the incoming message socket listener
this.util.presentAlert({ message: "Socket Did Connected" });//Shows an alert that socket did connect(which works)
});
}
})
In SocketProvider I have this piece of code
import { Injectable } from '@angular/core';
import { Http } from '@angular/http';
import 'rxjs/add/operator/map';
import * as io from "socket.io-client";
import { UtilProvider } from "../util/util";
import { DataProvider } from "../data/data";
import { Events } from "ionic-angular";
import { Observable } from "rxjs/Observable";
connect(user) {
return Observable.create((observer) => {
if (user !== undefined) {
this.currentUser = user;
this.socket = io('https://myapp-someserver-url.com/', { query: `userId=${this.currentUser._id}` });
this.socket.on('connect', () => {
//add-message-response emits from the node server.
this.socket.on('add-message-response',(data, user)=>{
//For debugging purpose on mobile I have this alert here
this.util.presentAlert({title:'New Message',subTitle:'Connection Block',message:data.message});// This doesn't work on mobile device.
});
// console.log(`Connected to socket ${this.socket.id}`);
this.util.presentAlert({message:"Socket Connected"});//This works on mobile alert show each time socket connects
observer.next(this.socket);
});
}
})
}
listenIncomingMessage() {
this.util.presentAlert({message:"listenIncomingMessage Initiated"});//This alert shows up which means this function was initiated but the block code doesn't work
/**
* Listen to new message event from socket
* Get the current page the user is, if the user is on chat interface don't vibrate
* Except the fromId is != the current user chatting
*/
//From my debugging so far, this block of code below doesn't execute on mobile device but works on browser.
this.socket.on('add-message-response',(data, user)=>{
this.util.presentAlert({title:"newMessage",message:data.message});//For debugging purpose when on mobile, but this doesn't work on mobile device.
this.events.publish('socket:incoming',data, user);//Publish some events
this.events.publish('socket:skool-chat',data, user);//Publish some events
if (this.util.currentComponent !== 'ChatPage') {
this.util.doVibrate();
this.whenMessageComesAction(data);
} else {
if (data.fromUserId !== this.data.currentSelectedUserId) {
this.whenMessageComesAction(data);//Perform some actions
}
}
})
}
I would have taught this.socket.on('add-message-response',(data, user)=>{}); Wasn’t emitted from my server side that’s why is not working but it works on mobile device.
Please any clue/observation is highly needed, thank you.