'mosquitto broker and web page

I'm trying to connect my local web page to a mosquito MQTT broker on mosquito explorer. I tried to use node-red with HTTPS nodes but it didn't work properly (I can receive data from the web page to the broker but I can't send it enter image description herefrom the broker to the web page). I need help.

<html>
  <head>
   <title>Envoi HTTP->NodeRed</title>
  </head>
  <body> 
    Envoi HTTP vers NodeRed 
    <form action="127.0.0.1:1880/essaiNODERED" method="get"> 
      <label for="idTemp">Temperature :</label>
      <input id="idTemp" name="temp">
      <label for="idText">Entrez un texte : </label>
      <input id="idText" name="text">
      <button type="submit">Envoyez...</button>
    </form>
  </body>
 </html>

I can send the temperature value from this page to the MQTT broker using a simple node-red code but I can't do the opposite

this is my broker on MQTT explorer:

image1

this is the node-red flow that receives data from the web page to the broker:

image2

javascripthtmlmqttnode-redmosquitto


Solution 1:[1]

The short answer is you probably don't using the approach you appear to be trying in the comment.

You have 2 choices

  1. Totally remove the HTML form and Node-RED from the system and just use the Paho JavaScript MQTT client to connect directly to the mosquitto broker (after you have configured it to support MQTT over Websockets). That way you can both publish messages and subscribe to topics directly in the webpage.

  2. If you REALLY must use Node-RED then you can use the WebSockets nodes to allow the page to connect to Node-RED and then you can send messages back to the page once they have been received in Node-RED using the MQTT nodes.

I suggest you use option 1 as it will be much simpler to get right.

This is totally based on the very minimal information you have provided. In future you must include a LOT more information in the question to start with.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 hardillb

Related Questions