diff --git a/html/src/components/terminal/index.tsx b/html/src/components/terminal/index.tsx
index b1e662e..f582083 100644
--- a/html/src/components/terminal/index.tsx
+++ b/html/src/components/terminal/index.tsx
@@ -45,6 +45,7 @@ export class Xterm extends Component {
private title: string;
private resizeTimeout: number;
private backoff: backoff.Backoff;
+ private backoffLock = false;
constructor(props) {
super(props);
@@ -58,10 +59,12 @@ export class Xterm extends Component {
maxDelay: 10000,
});
this.backoff.on('ready', () => {
+ this.backoffLock = false;
this.openTerminal();
});
this.backoff.on('backoff', (_, delay: number) => {
console.log(`[ttyd] will attempt to reconnect websocket in ${delay}ms`);
+ this.backoffLock = true;
});
}
@@ -122,6 +125,7 @@ export class Xterm extends Component {
socket.onopen = this.onSocketOpen;
socket.onmessage = this.onSocketData;
socket.onclose = this.onSocketClose;
+ socket.onerror = this.onSocketError;
terminal.loadAddon(fitAddon);
terminal.loadAddon(overlayAddon);
@@ -148,10 +152,18 @@ export class Xterm extends Component {
window.addEventListener('beforeunload', this.onWindowUnload);
}
+ @bind
+ private reconnect() {
+ if (!this.backoffLock) {
+ this.backoff.backoff();
+ }
+ }
+
@bind
private onSocketOpen() {
console.log('[ttyd] Websocket connection opened');
this.backoff.reset();
+
const { socket, textEncoder, fitAddon } = this;
const authToken = window.tty_auth_token;
@@ -174,10 +186,15 @@ export class Xterm extends Component {
// 1000: CLOSE_NORMAL
if (event.code !== 1000) {
- this.backoff.backoff();
+ this.reconnect();
}
}
+ @bind
+ private onSocketError() {
+ this.reconnect();
+ }
+
@bind
private onSocketData(event: MessageEvent) {
const { terminal, textDecoder, zmodemAddon } = this;
diff --git a/src/index.html b/src/index.html
index d84f125..49a5b4d 100644
--- a/src/index.html
+++ b/src/index.html
@@ -1 +1 @@
-ttyd - Terminal
\ No newline at end of file
+ttyd - Terminal
\ No newline at end of file