@larva.io/vue-websocket NPM

Larva.io Vue.js real-time WebSocket plugin

With this Vue.js plugin you can connect directly to Larva.io controller or Larva.io realtime cloud.

Installing and loading plugin

npm i @larva.io/vue-websocket

import larvaWebsocket from '@larva.io/vue-websocket';
Vue.use(larvaWebsocket, [wsurl]);

URL syntax: ws:// or wss://. If URL not provided, you can later connect using:

this.$larva.connect([wsurl]);
this.$larva.reconnect();
this.$larva.close();

Using in Vue components

Broadcasted events

export default {
  larva: {
    events: {
      data (topic, payload, dom) {
        // message received
      },
      open () {
        // socket opened
      },
      close () {
        // socket closed
      },
      error () {
        // socket error
      }
    }
  },
  created() {
    if (this.$larva.readyState() === 1) {
      // connected
      // https://developer.mozilla.org/en-US/docs/Web/API/WebSocket/readyState
    }
  }
}

Sending messages. Returned Promise for response.

// this.$larva.send(topic, [data], [DOM uuid]);
// examples:
this.$larva.send('iot-2/cmd/getLogs/fmt/json').then(data => {
    // handle data here
  }).catch(err => {
    // handle error here
  });

this.$larva.send('iot-2/cmd/getLogs/fmt/json', {data}).then(data => {
    // handle data here
  }).catch(err => {
    // handle error here
  });

  this.$larva.send('iot-2/cmd/getLogs/fmt/json', {data}, 'DOM UUID').then(data => {
      // handle data here
    }).catch(err => {
      // handle error here
    });
    this.$larva.send('iot-2/cmd/getLogs/fmt/json', null, 'DOM UUID').then(data => {
        // handle data here
      }).catch(err => {
        // handle error here
      });

Interceptors

Vue.$larva.interceptors.connect.use((url) => {
  // will be executed before .connect, url can be manipulated. You must return url
  return url;
});

Vue.$larva.interceptors.send.use((obj) => {
  // will be executed before .send, object can be manipulated. You must return object
  return obj;
});