リモート開発を行う際、Visual Studio Code(VSCode)とVPNの組み合わせは欠かせないケースがあります。
特に社内サーバーやクラウド環境など、特定のネットワークに限定されたアクセス環境では、VPNを通さなければ接続そのものができないことも少なくありません。
本記事では、「なぜVSCodeでVPN接続が必要になるのか?」という理由をわかりやすく解説するとともに、Remote SSH拡張機能との連携方法や、VPN環境下での設定のポイントまで丁寧にご紹介します。
テレワークやクラウド開発が当たり前になった今、セキュアなリモート開発環境を整えるための基本をここで押さえておきましょう。
VSCodeとは
VSCode(Visual Studio Code)とは、Microsoftが開発・提供している無料のコードエディタで、正式名称は「Visual Studio Code」です。
多くのプログラマーやエンジニアに支持されており、Windows・macOS・Linuxに対応しています。
VSCodeの主な特徴
-
軽量かつ高速
起動が早く、動作も軽快。大規模なIDEよりも軽い作業環境が構築できます。 -
豊富な拡張機能
JavaScript、Python、C++、PHP、Go など、ほぼすべての主要言語に対応する拡張機能があり、必要に応じて機能を追加可能です。 -
Remote開発機能(Remote Development)
ローカル環境からSSHやWSL、Dockerコンテナなどに接続して、リモートでコード編集・実行・デバッグができます。 -
Git連携が標準搭載
Gitリポジトリの操作やコミット、プッシュなどがVSCode上で直感的に行えます。 -
多言語対応&日本語化可能
インターフェースは多言語対応で、日本語化も拡張機能で簡単にできます。
-
無料なのに高機能
-
カスタマイズ性が高く、自分好みの開発環境を作れる
-
Microsoftが継続的に開発・更新しているため安心
-
初心者から上級者まで使いやすいインターフェースと機能構成
VSCodeでVPN接続が必要な理由
VSCodeでVPN接続が必要な理由は、主に以下のようなセキュリティやネットワークの制限に関わる要因にあります。
1. 社内ネットワークにしかアクセスできない開発環境がある
多くの企業や組織では、セキュリティの観点から社内ネットワーク内でしかアクセスできないサーバーやGitリポジトリを用意しています。
こうした環境に外部(自宅やカフェなど)からアクセスするには、VPNを通じて社内と同じネットワークに仮想的に参加する必要があります。
2. リモートサーバーへのSSH接続に制限がある
VSCodeの「Remote – SSH」機能を使えば、サーバー上のコードをローカルで編集できますが、SSHポート(通常22番)が特定のIPアドレスからの接続しか許可されていない場合、VPNがなければ接続できません。
3. 開発リソースが社内の内部IPアドレスに依存している
社内DNSやプライベートIPアドレスで運用されているシステム(例:intranet.local や 10.x.x.x)は、VPNなしでは名前解決も接続もできません。
4. クラウド環境(VPCなど)にVPN経由でしか入れない設定になっている
AWSやAzureなどのクラウド環境でも、VPCやセキュリティグループの設定により、VPN経由でのみアクセスが許可されていることがあります。
この場合、VSCodeからアクセスするには、まずVPN接続を確立してからでないと通信できません。
5. セキュリティポリシーでVPN接続が義務付けられている
会社によっては、開発業務を行うすべての端末はVPN経由でのアクセスを義務付けている場合があります。
これは通信の暗号化や監査のためで、たとえ技術的に接続できたとしても、VPNなしでは業務が許可されないケースも。
VSCodeでVPN接続する設定方法
VSCode(Visual Studio Code)でVPN接続を活用してリモート開発を行うには、以下の手順で設定します。
ここでは、VPN接続済みの状態で、VSCodeのRemote SSH機能を使ってサーバーに接続する一般的な方法を解説します。
前提条件
-
VPN接続ができる環境(VPNクライアントがインストール済み)
-
リモート先のSSH情報(IPアドレス、ユーザー名、鍵ファイルなど)
-
VSCodeがインストール済み
-
VSCodeに「Remote – SSH」拡張機能がインストールされている
手順1 VPNに接続する
まずはVPNクライアント(例:Cisco AnyConnect、OpenVPN、L2TPなど)を使って、社内やクラウド環境のネットワークに接続します。
接続後、ローカルPCから ping サーバーのIPアドレス などで疎通できることを確認してください。
手順2 VSCodeに「Remote – SSH」拡張をインストール
-
VSCodeを起動
-
左の拡張機能アイコンをクリック
-
検索欄に「Remote – SSH」と入力し、インストール
手順3 SSH接続の設定を作成する
-
コマンドパレット(
Ctrl + Shift + P)を開く -
「Remote-SSH: Add New SSH Host」を選択
-
以下のような形式で入力:
手順4 VPN経由でSSH接続する
-
VPNが有効になっていることを確認
-
コマンドパレットで「Remote-SSH: Connect to Host」を選択
-
作成した接続先(例:
my-vpn-server)を選ぶ -
接続が確立すると、VSCodeの左下に「SSH: my-vpn-server」と表示され、リモート環境での開発が可能に
-
VPN接続は有効か?(接続後、対象のIPにpingが通るか)
-
ファイアウォールでSSH(ポート22)がブロックされていないか
-
秘密鍵のパーミッション(
chmod 600 ~/.ssh/id_rsa)は正しいか -
SSHポートが変更されている場合、
Portを明示的に指定しているか
まとめ
VSCodeでのリモート開発を快適に行うためには、VPN接続が不可欠なケースが多く存在します。
特に企業環境やクラウド環境では、VPNを通じて安全かつ制限付きのネットワークにアクセスするのが一般的です。
この記事を参考に、正しくVPNを設定し、VSCodeのRemote SSH機能と組み合わせることで、どこからでも快適に開発作業ができる環境を整えましょう。




