We were in a meeting with some friends when one of them moved a card on the project's board, on my screen the card moved instantaneously, quite impressed I was wondering which technology was used to have this kind of real time events. I began digging and found out that Trello was using WebSockets. Actually, they use them a lot.

When you go on Trello a web socket connection is opened and each time a new event occurs, data are instantaneously sent to the web socket. It can be a notification, a new card or a new comment... The web socket will receive a little payload and the UI will be updated.

This payload can be private, for instance your Trello's notifications will be sent to you and only you, other people can't access them. To authenticate the user using a web socket, Trello use a token sent with the GET request, something like this:

wss://trello.com/1/Session/socket?token=51cc0b313cbab97d460038b9/2MDAf68quzJ5Cu2xsa96PJb2a8Rh84S34bHmMnbpR4xpBH4NvCUDhkCwS8dIllOp

This is a common way to authenticate a web socket connection. From there a session is established with the server. Using the token Trello knows who owns the session and so can send the data according to the person's rights.

To receive data about a Trello model (board, card, ...) you must first subscribe to a model using a payload like that: