Transform Your Terminal into a Shareable Web Page Using ttyd

Transform Your Terminal into a Shareable Web Page Using ttyd

Have you ever needed to demonstrate your terminal activities in real-time, whether you’re troubleshooting a server problem with a colleague or showcasing a complex command to a friend? Rather than taking screenshots or recording your screen, imagine the convenience of sharing your live terminal session via a simple web link. This method not only enhances collaboration but also allows for real-time visibility into your activities.

Linux offers various methods for terminal sharing, including traditional options like SSH, tools such as tmux and screen, as well as screen recording utilities like asciinema. While these options can be effective, they often involve unnecessary complexity and additional dependencies that can hinder your workflow.

Enter the ttyd command-line tool.ttyd simplifies sharing your terminal by transforming it into a web interface, enabling anyone with the link to access and even interact with your session without the need to install additional software or configure settings.

Key Features of ttyd

  • Utilizes Libwebsockets and libuv for exceptional performance.
  • Employs WebSockets for a seamless experience, even under limited connectivity.
  • Supports graphical ZMODEM for file transfers, allowing users to drag and drop files directly through the web browser.
  • Includes SSL/TLS encryption to ensure secure sessions, with options for authentication.
  • Runs on any designated port, and offers compatibility for deployment on devices like Raspberry Pi.
  • Features built-in copy/paste functionality between the terminal and the web interface.
  • Ability to restrict concurrent connections for session management.
  • Automatically opens sessions in the default web browser.
  • Enables single-client access restrictions for heightened security.

How to Install ttyd on Linux

For users on Debian or Ubuntu, you may find ttyd isn’t present in the default repositories. However, installation remains straightforward through alternative methods, such as building from the source.

Begin by ensuring your system is fully updated:

sudo apt update && sudo apt upgrade -y

Next, install the necessary dependencies for compiling ttyd:

sudo apt install -y build-essential cmake git libjson-c-dev libwebsockets-dev

Installation Of Ttyd Tool

Clone the ttyd repository from GitHub and compile it using the following commands:

git clone https://github.com/tsl0922/ttyd.git cd ttyd mkdir build && cd build cmake..make sudo make install

That’s all there is to it! You now have ttyd installed on your system.

For other Linux distributions, you can follow similar build guidelines, or alternatively, download a precompiled binary from ttyd’s GitHub releases page. To quickly download it, use the following wget command:

wget https://github.com/tsl0922/ttyd/releases/download/1.7.7/ttyd.x86_64

Make the downloaded binary executable:

chmod +x ttyd.x86_64

Using this method provides one of the quickest routes to getting ttyd operational across various Linux distributions. You can also utilize a universal package manager such as Snap to install ttyd:

sudo snap install ttyd --classic

Once ttyd has been installed, verify your installation by entering ttyd --version.

Transforming Your Terminal into a Shareable Web Interface

The simplest way to leverage ttyd is by sharing your default shell session. Execute the following command:

ttyd bash

This command will initiate a web server on port 7681 by default. To access it, simply open your web browser and navigate to http://localhost:7681 or http://your-ip-address:7681.

Shareable Web Page Created Using Ttyd

Your terminal should now be visible within a web page, and any local network users can access it by substituting ‘localhost’ with your machine’s IP address. You can find your IP by using ip addr show or hostname -I to share with others.

Beyond just sharing a shell, ttyd allows you to expose other command-line applications in the browser. For instance, the command ttyd htop will directly launch the htop process manager, while ttyd vim or ttyd top will share those respective tools.

Opening Top Command Line Tool Output On Webpage

If you wish to customize the port number for your session, you can easily do so using the -p flag:

ttyd -p 8080 bash

This makes your terminal available on port 8080 instead of the default 7681.

To prevent unauthorized access, ttyd also supports authentication through the -c option:

ttyd -c username:password bash

Logging In Option For Terminal Session Using Ttyd

This configuration prompts for basic HTTP authentication, ensuring that anyone attempting to access your terminal must input the designated credentials. While more sophisticated authentication is preferable for production environments, this method is effective for informal demonstrations or trusted networks.

Additionally, you can create a read-only session, prohibiting any input from users:

ttyd -R bash

This can be particularly advantageous for presentations or educational settings where you wish to maintain control. Conversely, utilize the -W flag for a writable and interactive session:

ttyd -W bash

Secure Sharing Over the Internet

When sharing your terminal over the internet, implementing encryption is crucial.ttyd offers HTTPS support using your own SSL certificate. If you lack an SSL certificate, you can create a self-signed one with OpenSSL for testing purposes, though for production use, it’s advisable to utilize a trusted Certificate Authority such as Let’s Encrypt.

While ttyd defaults to being accessible only on your local network, there’s often a need to extend this access externally. You can accomplish this safely through several approaches. One of the simplest methods is to integrate ttyd with a tunneling service like Tailscale or Cloudflare Tunnel, which securely makes your local port available on the internet via a temporary public URL. Alternatively, you can host ttyd on a VPS or cloud server with a domain name, allowing for permanent HTTPS access.

For more advanced configurations, you can bind ttyd solely to localhost and situate it behind a reverse proxy like Nginx or Caddy. This setup enables handling of SSL termination, authentication, and detailed access control.

Conclusion

With ttyd, the intricate process of terminal sharing transforms into a straightforward endeavor, akin to sharing a hyperlink.

Source & Images

Leave a Reply

Your email address will not be published. Required fields are marked *