• Home
  • Popular
  • Login
  • Signup
  • Cookie
  • Terms of Service
  • Privacy Policy
avatar

Posted by User Bot


27 Feb, 2025

Updated at 21 Mar, 2025

angular chat realtime didnt work between pc and mobile (backend springboot work fine)

chat real time between two pc work fine..between pc and mobile dont work.. from pc when i click on submit the data are already inserted in database but in frontend it show nothing the backend work fine..any help please ggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggggg


websocketservice


import { Injectable } from '@angular/core';
import { WebSocketSubject } from 'rxjs/webSocket';
import { catchError } from 'rxjs/operators';
import { of } from 'rxjs';

@Injectable({
  providedIn: 'root',
})
export class WebSocketService {
  public socket$: WebSocketSubject;

  constructor() {
    // Initialize WebSocket connection
    this.socket$ = new WebSocketSubject({
      url: 'ws://localhost:8088/ws', // Replace with your WebSocket URL
      deserializer: (e) => {
        // Attempt to parse JSON, or return plain text if parsing fails
        try {
          return JSON.parse(e.data);
        } catch (error) {
          console.warn('Received non-JSON message:', e.data);
          return e.data;  // Return as plain text if not JSON
        }
      },
      serializer: (msg) => {
        // Serialize outgoing messages to JSON (assuming you want to send JSON)
        return JSON.stringify(msg);
      },
    });

    // Subscribe to the WebSocket messages
    this.socket$.pipe(
      catchError((error) => {
        console.error('WebSocket error:', error);
        return of(null); // Gracefully handle errors
      })
    ).subscribe((message) => {
      if (typeof message === 'string') {
        // Handle plain text message
        console.log('Received plain text:', message);
      } else if (message && message.message) {
        // Handle JSON message (assuming message is in { message: string } format)
        console.log('Received JSON message:', message);
      } else {
        console.log('Received unknown format:', message);
      }
    });
  }

  // Send a message to the WebSocket server
  sendMessage(message: any) {
    this.socket$.next(message);
  }

  getMessages() {
    return this.socket$.asObservable();
  }

  // Close the WebSocket connection
  closeConnection() {
    this.socket$.complete();
  }
}


sendFunction in chatcomponentts

  // Send a message through WebSocket
  sendMessage(): void {

    console.log("user sender id : ",this.userSenderId);
    

    const chatMessage = {

      messageStatus:'UNSEEN',
      senderId:this.userSenderId,
      receiverId: this.ownerid,
      message:this.message
    }


    this.chatService.sendMessageBetweenTwoUsers(chatMessage).subscribe((data)=>{
      this.webSocketService.sendMessage(chatMessage.message);
      this.chatData.push(data);
      // this.getUserContacts(this.userSenderId);
      this.getUserContactsWithCount(this.userSenderId);

    })

    if (this.message.trim()) {
      console.log('Message Sent:', this.message);
      
      const messagePayload = {
        senderId: this.userSenderId,  // Current user sender ID
        receiverId: this.ownerid,  // ID of the recipient
        message: this.message.trim()  // The message content
      };

      // Send the message to the WebSocket server
      this.webSocketService.sendMessage(messagePayload);


      this.message = '';  // Clear the message input field after sending
    }
  }