How to Create a Web-based Remote Terminal with ngrok Plugin?

💡 Skip ahead to:

Ttyd Tool
Install ttyd
Register ttyd as a Service (Optional)
ngrok Plugin
Open a Tunnel for ttyd Service
Close the Tunnel

Creating a remote terminal for accessing edge devices is a convenient way for operators to directly perform tasks on the machines. Most remote terminals leverage the capability of SSH connection to realize remote access. In Allxon Plugin Station, we have integrated Upterm and Tmate, two open-source projects, to help users easily open remote terminals. In this article, we will demonstrate how to use the ngrok plugin and ttyd service together to enable a web-based remote terminal.

Ttyd Tool

ttyd is a simple command-line tool for sharing a terminal over the web. It is an open-source project hosted on its GitHub repository. To start using ttyd, we need to install it on the device. We will use the Send Command feature in the Monitoring page of the device to complete the step. Let’s navigate to the Send Command page.

Install ttyd

Go to ttyd GitHub release page, choose the ttyd version, and copy the link of ttyd.
Enter the command in Send Command to download ttyd on the device. (Example installed directory: /usr/local/bin/)
```
wget -qO /usr/local/bin/ttyd https://github.com/tsl0922/ttyd/releases/download/1.7.4/ttyd.aarch64
```
Enter the command in Send Command to make ttyd executable.
```
chmod +x /usr/local/bin/ttyd
```
Enter the command in Send Command to start ttyd.
```
/usr/local/bin/ttyd -W login > /dev/null 2>&1 &
```

Register ttyd as a Service (Optional)

Ttyd can be registered as a backgroud service in the Linux system. As a result, ttyd will keep running in the system background, which users can access to the remote terminal at any time.

Make ttyd service configuration file.

sudo bash -c "cat <<EOL > /etc/systemd/system/ttyd.service

[Unit]

Description=ttyd

After=syslog.target

After=network.target


[Service]

Type=simple

ExecStart=/usr/sbin/ttyd -W login

Restart=always

User=root

Group=root


[Install]

WantedBy=multi-user.target

EOL"

Reload the system service daemon
```
Systemctl daemon-reload
```

Start ttyd service

systemctl start ttyd && systemctl enable ttyd

ngrok Plugin

After ttyd is successfully installed and started on the device, we can use the ngrok plugin to redirect the locally running ttyd service to the Internet via the ngrok tunneling service. Let’s navigate to the ngrok plugin page.

Open a Tunnel for ttyd Service

Ttyd service is running on localhost with port number 7681 by default. Unfold the Open tunnel inside the Commands card, select Endpoints with HTTP, and specify Port with 7681.

Click on the Execute button.
Open the link that appears in the Stats card to access the remote terminal.

Close the Tunnel

Copy and paste the link of ttyd remote terminal into Close tunnel.
Click on the Execute button.