自前サーバでCodespacesが使えるVisual Studio Code Serverを動かしてみた

VSCodeがバージョン1.69でVisual Studio Code Serverをpreviewリリースしました。これはおそらくGithub Codespacesでうごいているものの自前サーバ用ソフトウエアと思われるので、早速試してみました。

追記：この方法は現在動作しなくなっています。詳しくはこちらをご確認ください。

https://qiita.com/ku_suke/items/07b67bd710b17a3a7cf3

＝＝＝＝以下当時の記事＝＝＝＝＝


マニュアルはこちら

https://code.visualstudio.com/blogs/2022/07/07/vscode-server

これまでのGitHub Codespacesやgithub.devのレビューはこちら

https://qiita.com/ku_suke/items/55676049940c234e49b5

https://qiita.com/ku_suke/items/07deb49dba04bdc36216

このマニュアルによると、インビテーションが必要とのことです。申し込みフォームから申請しましょう。「私はエンタープライズ企業で働いていて彼らはファイアーウォールの内側でしか仕事をすることを許可しません、だから私はVS Code Serverを学びエンプラ環境に生かしたいです。」と書いてみました。

# ひとまずサーバを用意

Vultrで東京リージョン、2 vcpu/ 4GB ramのDebianインスタンスをデプロイしてみます。Firewallはひとまず22番だけあけておきます。

![20220708-2143.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/8727/956707a1-b58a-d609-4c34-49773bbde755.png)

それでは、細かい話は置いといて、インストールできるかやってみましょう。

```bash
~# wget -O- https://aka.ms/install-vscode-server/setup.sh | sh
```

インストールはこれだけです。早速起動してみましょう

```bash
~# code-server

VS Code Server

*
* By using the software, you agree to the
* the Visual Studio Code Server License Terms (https://aka.ms/vscode-server-license) and
* the Microsoft Privacy Statement (https://privacy.microsoft.com/en-US/privacystatement).
*

✔ Do you accept the terms in the License Agreement · yes
[2022-07-08 12:49:48] warn Error using system keyring storage: error reading keyring: Platform secure storage failure: zbus error: I/O error: No such file or directory (os error 2)
[2022-07-08 12:49:48] warn You can set up keyring storage for more secure of credentials: https://aka.ms/vscode-server-keyring
```

キーリングがないと怒られましたのでインストールしましょう。

```bash
~# apt update && apt install -y gnome-keyring
```

# GitHubとはまだ接続できないっぽい

`To grant access to the server, please log into XXXX-XXXX and use code https://github.com/login/device`

次にこの表示が出て認証を済ませたのですが、トンネル接続ができないという理由でエラーが出てしまいました。おそらくこれを済ませると既存のCodespacesやローカルのVS Codeからインスタンスのみ自前サーバに接続することができるものと思われます。。

# ローカルモードで立ち上げる

GitHubと接続できなくても、ローカル接続はできます。先ほどのkeyringをインストール済みなら、以下のコマンドでローカル起動することができます。

```bash
~# dbus-run-session -- sh -c "(echo 'yoursecrethere' | gnome-keyring-daemon --unlock) && code-server serve-local --host 0.0.0.0"
SSH_AUTH_SOCK=/run/user/0/keyring/ssh
[2022-07-08 13:13:40] info Found existing installation at /root/.vscode-cli/server-stable-web/bin/92d25e35d9bf1a6b16f7d0758f25d48ace11e5b9
[2022-07-08 13:13:40] info Starting server...
*
* Visual Studio Code Server
*
* By using the software, you agree to
* the Visual Studio Code Server License Terms (https://aka.ms/vscode-server-license) and
* the Microsoft Privacy Statement (https://privacy.microsoft.com/en-US/privacystatement).
*
Server bound to 0.0.0.0:8000 (IPv4)
Extension host agent listening on 8000

Web UI available at http://localhost:8000/?tkn=11f5e388-c50d-47bc-a173-5f24ba8be09d
[13:13:40] Extension host agent started.
```

これで、0.0.0.0:8000をリッスンするので、DebianのufwとVultrのファイアーウォールそれぞれで8000番ポートを開放します（むしろufwは今回落とした。Vultrなら自分のIPのみさくっと許可できるため）

![20220708-2214.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/8727/71fe7545-c9a4-9b3d-44be-8fb56534142a.png)

おお、無事うごいた。GitHubと接続していないのでなにもcloneしていないのですが、素のVS Codeがブラウザ上で動作しているようです。

## terminalはうごくのか？

ここで気になるのが動作環境です。Vultr上のターミナルにも接続できるのだろうか。GitHub上で起動するgithub.devはあくまでWebフロントのみで、サーバが必要な動作はできませんでした。

![20220708-2231.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/8727/2b294001-900f-d61d-e84e-6a1a9770e000.png)

うごいた～～～～！！！Visual Studio Code Serverを起動したユーザプロセスそのままのtermnalが動いています。

ということで[適当なWebapp](https://bun.sh/)を動かしてみましょう。
```bash
~# mkdir bunbundemo
~# cd bunbundemo/
~# curl https://bun.sh/install | bash
~# vim ~/.bashrc
~# vim http.js
~# bun run http.js
```

![20220708-2242.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/8727/ce150f87-89e7-148a-ecbb-318ae3f372e9.png)

同様にポート開放して試すと・・うごいた～（当然）

# GitHubとシームレスでなければすぐに使える

セキュリティ周りなど考慮するポイントはいくつかあるものの（うっかりrootで常用しないとか）ついにCodespacesが自前サーバで使えるようになったので、イントラ環境でどうしても接続しないといけないAPIサーバがあるとか、ベアメタルマシンで動作させて高速ビルドさせたいとか、そういった向きの皆さんには待望の製品がリリースされました！

またpreviewが通過したら続きをレポートしようと思います！

# 追記：プレビュー通過したので接続してみた

無事に通過したので、接続してみたところ、簡単にトンネルを張ることができました。

```
# code-server serve

Open this link in your browser https://insiders.vscode.dev/+ms-vscode.remote-server/my-server-name

```

こんな感じで、トンネルURLが表示されるので、そのままブラウザでアクセスすると（Github認証によって）普通にアクセスできるようになります。ファイアーウォールを開放する必要もないので安全ですね。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/8727/2a3f4c7a-aae8-9ac3-eb93-51ccdbea3c4f.png)

プレビュー版なのでロゴは緑色です。

## ポート転送もついてきて便利

Dockerを起動して、ポートのタブからアクセスさせたいポートを入力すると、自動でエンドポイントが作成されます。初回アクセスはOAuthダイアログが表示されました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/8727/df100216-ecb7-0619-d182-0a6a776b6ea1.png)

作成されたエンドポイントは

`https://xxxxxxxx-9080.asse.rel.tunnels.api.visualstudio.com/`

という形式で、インスタンス名ーポート名となっているようです。

## Web UIサーバはいまのところUSリージョンっぽい

ところで、東京のサーバを使っているのにすこしラグがあるなと思って調べてみたのですが、Web UIサーバはシカゴにありました。そのため、速度を求める場合は自分でトンネルを張ったほうがいいかもしれません。

トンネルサーバに関しては自動振り分けがあるのか、シンガポールをさしていました。いずれにしてもまだ日本リージョンはないようですね。

個人的には、CloudflareのTunnelを試してみようかと思います。そうすれば大体同じようなことができそうですしね。

## 常用するなら料金はやっぱりVPSのほうが安い

公式のCodespacesは4コアで1時間当たり$0.36、つまり約50円なのに対し、国産VPSはだいたい4コア4GBプランで3000円前後がおおい（最近はじまったXserver VPSなんかもっと安い）。3000円とすると60時間でCodespacesが超えてくるので8営業日×8時間くらい以上使うなら自前で構築したほうが安くなるかもしれない。しかも国内で通信が完結するので早い（CodespacesのWeb UIはシンガポールリージョン）。

もちろんアクセス制限だとかポートフォワードだとか知るべき知識はたくさんあるが、こんなのに手を出す人はそのあたりも乗り越えるでしょう。

いずれにしてもかなり安定して動くので、もうチーム開発これでいいかなという気持ちになってきました。副業メンバーなんかには社用PCを支給せずにこのインスタンスだけ与える、というのでもいいんじゃないかと思いました。