VSCode CLIを利用したVSCode Tunnelのセットアップ

code-tunnel.md

VSCode CLIを利用したVSCode Tunnelのセットアップ

概要

VSCode CLIをサーバーにインストールすることで、SSHを経由することなくVSCodeやvscode.dev上からサーバーにアクセスすることができる様になる

できること&できないこと (2023/11/13時点)

できること

• コードブラウジングと編集
• ターミナルを開く
• 各種拡張機能
• VSCode Devcontainerの起動
  • ブラウザ版からは利用不可。VSCodeから接続したときのみできる
• HTTP通信のフォワーディング

（おそらく）できないこと

• Non-HTTPな通信のフォワーディング (素のTCP, UDPのフォワーディング)

セットアップ方法

参考: https://code.visualstudio.com/docs/remote/tunnels#_using-the-code-cli

# VSCode CLIのダウンロードと展開
curl -Lk 'https://code.visualstudio.com/sha/download?build=stable&os=cli-alpine-x64' --output vscode_cli.tar.gz
tar -xf vscode_cli.tar.gz

# ログインするために一度VSCode Tunnelを起動 -> Ctrl + Cで停止
# 途中でマシンの識別名を設定する
./code tunnel

# バイナリを移動
sudo mv ./code /usr/local/bin

# サービスとしてインストール (~/.config/systemd/user/code-tunnel.service)
code tunnel service install

# 毎回起動時に実行されるようにする
sudo loginctl enable-linger $USER

上記の手順をサーバ上で実行した後に、https://vscode.dev/tunnel/<マシンの識別名> にアクセスすることでブラウザ上からアクセスすることができる

また、Remote - Tunnelsの拡張機能を追加することで、 VSCode上からもアクセスすることができる