Rocket Chat Realtime API in browser

I want to create a Rocket Chat client to subscribe to a channel through browser using Realtime API. Documentation here does not provide step by step procedure. Please let me know how to achieve it.

Links to any documentation would be very helpful.

Answer

I had less idea about websockets when I asked this question. For the benefit of all, mentioning the steps I followed.

  1. Open websocket
    var rocketChatSocket = new WebSocket("ws://locahost:3000/websocket");
  1. Connect
    var connectRequest = {
        "msg": "connect",
        "version": "1",
        "support": ["1", "pre2", "pre1"]
     }
     rocketChatSocket.send(JSON.stringify(connectRequest));

After connecting, keep responding with {"msg":"pong"} for {"msg":"ping"} from server.

  1. Login with authToken received by calling this API
     var loginRequest = {
        "msg": "method",
        "method": "login",
        "id": "42",
        "params": [
            { "resume": "authToken" }
          ]
    }

    rocketChatSocket.send(JSON.stringify(loginRequest));
  1. Subscribe to room
     var subscribeRequest = {
       "msg": "sub",
       "id": "unique-id",
       "name": "stream-notify-room",
       "params":[
        "room-id/event",
         false
       ]
    }

    rocketChatSocket.send(JSON.stringify(subscribeRequest));
  1. Send message
   var request={
       "msg": "method",
       "method": "sendMessage",
       "id": "42",
       "params": 
       [
          {
            "_id": "message-id",
            "rid": "room-id",
            "msg": "Hello World!"
          }
       ]
    }

    rocketChatSocket.send(JSON.stringify(request));
Source: stackoverflow
The answers/resolutions are collected from stackoverflow, are licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0 .