探し方が悪いのか、リモート先で起動させたdevcontainerの特定コンテナにブラウザアクセス方法が見つからず、
いろいろ触ってわかったので、忘れないように残しておく。
まず、作業マシンのvscodeからリモートのマシンにホスト接続してdevcontainerを起動する。 (ここまでの手順については割愛)
ここでリモート先のdevcontainer設定は以下の通りとする。 .devcontainer/devcontainer.json
{ "name": "sample", "dockerComposeFile": ["../docker-compose.yml", "docker-compose.yml"], "service": "dev", "workspaceFolder": "/workspace/sample", }
docker-compose.yml
version: '3'
services:
nginx:
image: nginx:latest
container_name: nginx
hostname: nginx
ports:
- "80:80"
.devcontainer/docker-compose.yml
version: '3'
services:
dev:
image: ubuntu
container_name: dev
hostname: dev
volumes:
- ./:/workspace/sample
command: sleep infinity
devコンテナ内でコード書いて、nginxコンテナ上で公開しているシンプルな構成
ここから作業マシンのブラウザでリモートのnginxコンテナに接続させる。
手順は以下の通り、
- コマンドパレットを起動して(macならcmd + shift + p)、「Forward a port」を選択
- 入力フォームに接続したいコンテナ名とポートを入力
今回の例だと「nginx:80」と入力
ここまでで一旦、作業マシンのブラウザでlocalhostと入力するとnginxコンテナのトップページが表示されるようになる。
ローカルの80以外でフォーワードさせたい場合は、
vscodeのポートタブを開いて変更したい設定を右クリック、メニューから「Change Local Address Port」を選択して、
ポート番号を入力することでポート変更できる。
以上
