Not receiving payloads from mosquitto via websockets

Question

I'm using a VPS and I'm sending data from my Arduino to the server via MQTT.

Mosquitto print payloads via terminal successfully but when I try to print it in real time via a web page nothing happens.

Knowing that I've already allowed websockets in Mosquitto conf, if I run :

sudo netstat -plnt

I get :

tcp        0      0 0.0.0.0:1883            0.0.0.0:*               LISTEN      
13248/mosquitto
tcp        0      0 0.0.0.0:1884            0.0.0.0:*               LISTEN      
20169/mosquitto
tcp6       0      0 :::1883                 :::*                    LISTEN      13248/mosquitto

the topic I'm sending name : /pression and the code I'm using is:

  <script>

    var websocket="myserver.ovh.net";
    var port= 1884;
    var user="username";
    var pass="password";


    client = new Paho.MQTT.Client(websocket, port, "innovation");


     // set callback handlers
     client.onConnectionLost = onConnectionLost;
     client.onMessageArrived = onMessageArrived;

  var options = {
   useSSL: false,
   userName: user,
   password: pass,
   onSuccess:onConnect,
   onFailure:doFail
}

// connect the client

client.connect(options);


// called when the client connects

 function onConnect() {
// Once a connection has been made, make a subscription and send a 
message.


 document.getElementById("connstatus").innerHTML = "Mqtt Connected";

 console.log("Mqtt Connected");

  client.subscribe("/pression");

    }

    function doFail(e){
    console.log(e);
   }

   // called when the client loses its connection
    function onConnectionLost(responseObject) {

  document.getElementById("connstatus").innerHTML = "Mqtt Not Connected";

     if (responseObject.errorCode !== 0) {
         console.log("onConnectionLost:"+responseObject.errorMessage);
    }
   }

   function onMessageArrived(message) {
   console.log("Pression is :");
   document.getElementById("connstatus").innerHTML = message.payloadString;
   console.log(message.payloadString);

   }


  </script>

when I run the script it says "Mqtt Connected" than nothing happened.

However if I run in the terminal :

         mosquitto_sub -t '/pression'

I get the pressure values.

if I keep the web page on for some minutes I get this message :

       Mqtt Connected
       test.html:76 onConnectionLost:AMQJS0008I Socket closed.

config file :

   # Place your local configuration in /etc/mosquitto/conf.d/
   #
   # A full description of the configuration file is at
   # /usr/share/doc/mosquitto/examples/mosquitto.conf.example

   pid_file /var/run/mosquitto.pid

   persistence true
   persistence_location /var/lib/mosquitto/

   log_dest file /var/log/mosquitto/mosquitto.log

   include_dir /etc/mosquitto/conf.d

   #password_file /etc/mosquitto/passwd
   #allow_anonymous false



   listener 1884
   protocol websockets

mosquitto log :

       1557922249: Config loaded from /etc/mosquitto/mosquitto.conf.
       1557922249: Opening websockets listen socket on port 1884.
       1557922254: New client connected from xx.xx.11.163 as innovation (c1, k60, u'innovation').
       1557922279: Socket error on client innovation, disconnecting.
       1557922279: New client connected from xx.xx.11.163 as innovation (c1, k60, u'innovation').
       1557922318: Socket error on client innovation, disconnecting.
       1557922318: New client connected from xx.xx.11.163 as innovation (c1, k60, u'innovation').
       1557922346: Socket error on client innovation, disconnecting.
       1557922346: New client connected from xx.xx.11.163 as innovation (c1, k60, u'innovation').
       1557922363: Socket error on client innovation, disconnecting.
       1557922364: New client connected from xx.xx.11.163 as innovation (c1, k60, u'innovation').
       1557922463: Socket error on client innovation, disconnecting.

Answer 1

OK, the problem here is most likely that you are using a fixed client id ( innovation ) in the HTML.

You can only ever have 1 client connected with a given client id, so the broker will disconnect the oldest one when a new client with the same id connects (eg when you reload the page).

Try changing the connection line to something like this:

var clientID = "innovation_" + new Date().getTime();
client = new Paho.MQTT.Client(websocket, port, clientID);