Getting error on FireFox while using websocket php and javascript

I want to show realtime data on browser. I am using Rachet library for websocket. It is working on localhost in all browsers. After uploading on the linux shared hosting, it works fine on all browser except only mozilla Firefox. On the mozilla it gives error.

index.html is:

<!DOCTYPE html>
  <title>WebSocket Chat</title>
  <h1>WebSocket Chat</h1>
  <div id="chatBox"></div>
  <input type="text" id="messageInput" placeholder="Type your message..." />
  <button id="sendButton">Send</button>

    const socket = new WebSocket('wss://');

    // Function to save message on the server
        function saveMessage(message) {
          const xhr = new XMLHttpRequest();
'POST', 'save-message.php');
          xhr.setRequestHeader('Content-Type', 'application/json');
          xhr.send(JSON.stringify({ message: message }));

    // Function to fetch messages from the server
    function fetchMessages() {
     const xhr = new XMLHttpRequest();'GET', 'fetch-messages.php');
      xhr.onreadystatechange = function() {
            if (xhr.readyState === XMLHttpRequest.DONE) {
              if (xhr.status === 200) {
                const messages = JSON.parse(xhr.responseText);
                const chatBox = document.getElementById('chatBox');
                messages.forEach(function(message) {
              const messageElement = document.createElement('div');
              messageElement.textContent = message.fname;
          } else {
            console.log('Error fetching messages:', xhr.status);

    // Event listener for receiving messages from the server
    socket.addEventListener('message', function(event) {
      const message =;
      const chatBox = document.getElementById('chatBox');
      const messageElement = document.createElement('div');
      messageElement.textContent = message;

    const sendButton = document.getElementById('sendButton');
    sendButton.addEventListener('click', function() {
      const messageInput = document.getElementById('messageInput');
      const message = messageInput.value;
      messageInput.value = '';

      // Save the sent message on the server

    // Fetch messages when the page loads

server.php is:
     require 'vendor/autoload.php';

use Ratchet\MessageComponentInterface;
use Ratchet\ConnectionInterface;
use Ratchet\Server\IoServer;
use Ratchet\Http\HttpServer;
use Ratchet\WebSocket\WsServer;
use Symfony\Component\HttpFoundation\Request;

class Chat implements MessageComponentInterface {
  protected $clients;

  public function __construct() {
   $this->clients = new \SplObjectStorage;

public function onOpen(ConnectionInterface $conn) {
$request = $conn->httpRequest;

// Handle the WebSocket handshake here
// You can perform any necessary checks or validation before accepting the connection

// Example: Check if the WebSocket upgrade header is present
if (!$request->hasHeader('Upgrade') || strtolower($request->getHeader('Upgrade')[0]) !== 'websocket') {
    // Close the connection if the Upgrade header is missing or incorrect

// Example: Check if the request contains the expected WebSocket version
if (!$request->hasHeader('Sec-WebSocket-Version') || $request->getHeader('Sec-WebSocket-Version')[0] !== '13') {
    // Close the connection if the WebSocket version is not supported

// Example: Check other necessary conditions

// Store the connection

  public function onMessage(ConnectionInterface $from, $msg) {
    $message = htmlspecialchars($msg);

    foreach ($this->clients as $client) {

  public function onClose(ConnectionInterface $conn) {

  public function onError(ConnectionInterface $conn, \Exception $e) {
    echo "An error has occurred: {$e->getMessage()}\n";

$chat = new Chat;
$server = IoServer::factory(
  new HttpServer(
    new WsServer($chat)

The websocket is working all the browser except only firefox. It gives error:

Firefox can’t establish a connection to the server at wss://

I am trying to solve it from past 3 days. I'm using a shared hosting. The hosting provider is saying that everything is perfect from our side. Now I'm hopeless. Please solve my problem anyone. Also I've valid https certificate.

And you’re sure you dont have like… extensions or settings on the firefox side that’s preventing the connection?

Also all this XHR requests let me guess that your library is a pretty old one. Maybe there are some incompatibilities?

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.