Embedding the remote console

The HTML console is a very useful tool for end-users to be able to interact with the server via the out-of-band network in an emergency or even as primary means of managing a server.

To integrate the console into an 3rd party customer portal use the following example:

github.com/metalsoft-io/UI-console-implementation-example

Main components

  1. Frontend (console-implementation-example-ui): A React.js-based demonstration UI designed to assist with the integration of the Guacamole client. This UI initiates a connection to the Metalsoft’s Guacamole server via a proxy, enabling VNC functionalities in your application.

  2. Backend (console-implementation-example-backend): A NestJS-based server responsible for retrieving the cookies required for the Guacamole client to establish a secure connection. This is critical for the successful operation of the proxy and ultimately the VNC console.

  3. Proxy (NGINX) Both the backend and the frontend components interact through an NGINX proxy server that serves three primary roles:

  • Acts as a reverse proxy to Metalsoft’s private Guacamole server, making it accessible.

  • Hosts the console-implementation-example-ui for demonstration or testing purposes.

  • Routes requests to the console-implementation-example-backend, facilitating cookie retrieval.

Key Requirements:

  • Both the backend and the proxy must be under the same domain to successfully retrieve cookies.

  • NGINX server must be configured to route requests appropriately among the console-implementation-example-ui, console-implementation-example-backend, and Metalsoft’s Guacamole Server.

To get started follow the following guide: github.com/metalsoft-io/UI-console-implementation-example