Websockets Experimentation

Hello,

I have been curious about using Websockets for different IoT projects and finding info in the API seems promising in figuring out how it works with Webthings.

From my understanding, this web socket interaction is divided into four parts:

  1. A subscription object for configuring the type of connection to be established. I want to load a numerical live feed from sensors so I’m attempting to work with the setProperty example here: [https://iot.mozilla.org/wot/#setproperty-message](http://Web Things API Example)

  2. A new web socket is created with a link along the lines of (‘wss://me.mozilla-iot.org/things/sensor/properties?jwt=’, ‘webthing’)

  3. An onopen function with a method along the lines of websocket.send(JSON.stringify(subscription object))

4: An onopen function that parses data from a response.

The thing that confuses me after browsing the forums, checking the docs, and reading the gateway controllers, is the subscription object. There were a few forum posts that I thought might help, but I couldn’t quite get my head around. I thought that using a key-value pair in the format of the api would do it, but I’m clearly not getting it. Would any of you be kind enough to tell me where I went wrong or send a successful example?

But a picture is worth a thousand words! Here is the websocket portion of my componentDidMount:

Socket Error

I can not see that picture. it looks like this to me:

The propertyStatus message will come from the gateway, it’s not something you send. Here is the basic message breakdown:

  • Client-to-gateway
    • setProperty: set a property value
    • requestAction: request a new action
    • addEventSubscription: subscribe to specific new events
  • Gateway-to-client
    • propertyStatus: notification that a property value changed
    • actionStatus: notification that a previously requested action’s status has changed
    • event: a new event which was previously subscribed to

If all you’re wanting are property updates via the WebSocket, you don’t actually need to send anything after opening the socket.

SOLUTION

hi there. Sorry for not responding but I was away from my project due to this pesky pandemic. Stepping back to the project, I solved my issue.

Essentially, I wanted to measure my indoor temperature temperature against the outdoor temperature on a two-line graph overlay. As you likely already know, openWeather’s API allows for readings every hour, as shown on their WoT extention’s readings, as opposed to arduino’s instantaneous stream from the websocket.

So in order to show even lines and not wait for an outdoor temperature to render, I make an HTTP request to my openWeather extention on the gateway INSIDE of the onmessage function for the websocket. That way, the outside temperature’s readings are always on par with the indoor readings, allowing for a comparison for any given period of time. You were all a big help. I hope this helps somebody else trying to figure out this kind of thing in the future.

On a side note, my data only populates my graph when the app loads up, but if anyone has had success grabbing stored data from a certain period of time similar to how the Gateway’s logs graphs data from times such as a minute or 7 days ago, it would be appreciated! All the best and here’s the code for my solution in onmessage(e):

here’s an example of the chart in action (using react-chartjs-2):