Using Cockpit raw channels feature for connecting to a local port through websockets

Recently I was at GUADEC and had the oportunity to hang out with Cockpit folks in their BoF.

We were talking with Andreas Nilsson and Dominic Perpeet about the design of our cockpit plugin, giving us useful resources and ideas like patterns for visualizing our info and resources like the patterns examples plugins.

Also I sit with Steff Walter for talking about how to use cockpit as a bridge from a websocket to a real tcp socket in our machine and be able to connect to our virtual machines using spice-html5.

The first thing you need to know is that cockpit has already channels documentation and how to use them.

The part I don't knew, was where is cockpit exposing that websocket for being used. And this is the answer:

/cockpit/channel/CRSF_TOKEN?query

Where CSRF_TOKEN is the CSRF token for current cockpit session and query is the base64 encoded options for the channel.

var query = window.btoa(JSON.stringify({
  payload: 'stream',
  protocol: 'binary',
  address: location.hostname,
  port: port,
  binary: 'raw',
}));

var cockpit_uri = 'ws://' + location.hostname + ':' + location.port +
  '/cockpit/channel/' + cockpit.transport.csrf_token + '?' + query

For a reference implementation you can take a look at Fleet Commander spice client code in our Github