messede-degod / sf-ui

A GUI Frontend for services provided by segfault

Segfault UI

A UI frontend for the services provided by segfault.

Install With Docker

• Clone the repo : git clone https://github.com/messede-degod/SF-UI && cd SF-UI
• Make any changes to config.yaml if you wish
• Build the image: sudo docker build -t sfui .
• Run the container: sudo docker compose up -d
• Access SFUI at http://localhost:7171

Regular Installation

Install Deps

• Install Basics: sudo apt install -y npm make golang

• Install Angular: npm install -g @angular/cli

• Install JS Deps: cd ui && npm install

Building

• Run make all to build the complete application, binary can be found in the bin directory.

Recipes to build individual components

• Run make filebrowser to build the filebrowser UI (Run this only if building for the first time, or the filebrowser sources have changed).

• Run make UI to build the UI (Run this only if building for the first time, or the UI sources have changed).

• Run make prod to build a production ready static binary (Run make UI if neccessary beforehand).

Install & Run

Run ./bin/sfui -install to install sfui, visit http://127.0.0.1:7171 in browser to access SFUI. From here on use systemctl to control sfui.

Development environment

• Start Angular dev server by runnning cd ui and ng serve -c development
• Start SFUI local server by running make dev and ./bin/sfui, make sure you have debug set to true in config.yaml.

How it works

             Websockets          SSH-Over-TCP

WebBrowser <------------> SFUI <-------------> Segfault

SFUI starts by accepting a secret and a domain (ex: segfault.net, de.segfault.net .etc) from the user, it then establishes a connection to the given segfault domain using the secret (this is similar to running ssh -o "SetEnv SECRET=aabbccddefgh" [email protected]), once the SSH connection is established, SFUI attaches the obatined SSH shell to a websocket endpoint (/ws),

xterm.js then allows the web browser to interact with the websocket, hence enabling the user to interact with the shell.

Info

Application currently embeds the UI files into binary, using go's embed feature (this is for convenience).

In production it may be preferable to serve the UI content using a webserver like nginx, See other/nginx/Readme.md for further instructions.

Consider increasing ulimit if serving large number of clients

Acknowledgement

This project is inspired by :

• ttydtsl0922/ttyd

• yudai/gotty

• hackerschoice/segfault

• pgaskin/easy-novnc

This project uses :

• creack/pty

• xtermjs/xterm.js

• Xpra-org/xpra-html5

• filebrowser/filebrowser

• novnc/noVNC

sf-ui's Issues

Implement Flow control

Implement flow control recommended by xterm.js, https://xtermjs.org/docs/guides/flowcontrol/

Notification when users connect to a shared desktop

• Provide notification when a user connects to a shared desktop
• Show a badge indicating no of connected users (to a shared desktop)

Provide a systemd service file for SFUI

Limit connection to shared desktop

Limit the amount of people who can connect to shared desktop

columns/lines not set correctly

set to 80/24 whereas web terminal is various size. This results in htop and other programs not displaying correctly.

typing resize will set them correctly. That would be a hack. The command uses terminal escape sequence to query the user's terminal (xterm.js). It does not resize automatically when the xterm/browser window is changed (see below how to do that instead).

The web xterm.js should detect the window size change (in C that would be SIGWINCH -> ioctl(..TIOCGWINSZ) and then forwarding the new window size to the peer and call ioctl(..TIOCSWINSZ)).

On the xterm.js side, past the websocket: does it operate on a PTY and so is 'stty rows 50 columns 120' possible and to have a signal handler for size changes?

Keep SSH connection alive

Don't kill the SSH connection when websocket disconnects. Perhaps wait for a few minutes before killing the connection.

Advantages:
1) Prevents reconnection when a session is accidentally closed.
2) Enables users to switch network connections without losing the session.

Hide the cmdline of any ssh process that sfui starts

Hide the cmdline of any ssh process that sfui starts

Browser Reload should connect to same server or login screen

Log in to a session with a terminal open. Pressing "reload" in the browser closes the active root server and a new root server is created.

1. ideally it should connect back to the same root server
2. Or return to the login screen

New Terminal should connect to same root server

After creating new session. A menu bar appears at the top.

" [Terminal 1 x] [+]"

Clicking on "x" currently creates a new SECRET (e.g. a new root server instance). It would be better to log in to the same server instance.

Dont spawn zsh for every SSH connection

save memory resources (zsh allocates 8-12 MB RSS for each shell).

connection drop if not in focus

Terminal becomes unresponsive if not in focus for 60 seconds. I also see in the SF log files that the user's root server session is terminated (ssh exit).

to reproduce: start a SF-UI terminal via port 80. Remove focus from browser. Come back to browser after 61 seconds. Observe that prompt is still blinking (xterm.js?) but no command can be issued and terminal no longer seems to be connected to sf's root server.

Ideally we like to keep the session alive as long as the webpage (terminal) is open (regardless if the terminal has the focus).

Start necessary GUI process in background without having to type any commands

Run commands like startxweb automatically when a GUI is requested.

Prompt user to save the secret once a new instance is created

Prompt user to save the secret once a new instance is created, i.e after clicking start new on the login page.

Prevent automatic reconnects in XPRA client

if a user halts a instance when the XPRA GUI was active, XPRA clients tries to reconnect, those attempts would signal sfui to start the instance again.

Missing tooltips for guiding users

It would be nice to add some tooltips over the icons to help users to understand their meaning / use without having to click on it.

Something like that:

But in a better way 😅

I've made this from the console but maybe I've guessed the meaning wrongly:

But if that's correct, I can try to make a pull request and add it to the main code.