結論から言うと、これはNode.js自体の優先順位ではなく、WSL2のネットワークの仕組み(ポートフォワーディング)による挙動です。
結論として、「先にポート(3000)を占有したほうが勝ち」という大原則がありますが、WSL2が起動している間はWindowsからWSL2への自動転送機能が働くため、このような挙動になります。
詳細な理由は以下の3つのステップで説明できます。
1. ポートは「早い者勝ち」が原則
ネットワークのルールとして、1つのポート(今回は3000)には同時に1つのプロセスしかバインド(占有)できません。
- 先にWSL2でNode.jsを起動すると、WSL2側のプロセスがポート3000を占有します。
- その状態でWindows側でもNode.jsを起動しようとすると、通常は
EADDRINUSE(すでに使われています)というエラーが出るか、Windows側では正常に通信を受け付けられない状態になります。
2. WSL2の「Localhost Port Forwarding」の働き
WSL2には、「WSL2内で開いたポートを、Windows側のlocalhostに自動で転送(フォワーディング)する」機能がデフォルトで備わっています。
- WSL2のNode.jsがポート3000で待機する。
- WSL2の機能が、Windows側の
localhost:3000へのアクセスを、自動的にWSL2内へ転送する。 - そのため、ブラウザでアクセスするとWSL2側が反応します。
3. WSL2を終了した時の挙動
WSL2のNode.jsを終了すると、ポート3000の占有が解除され、自動転送もストップします。
すると、裏で起動していた(あるいはエラーで待機状態だった)Windows側のNode.jsがポート3000の通信を受け取れるようになるため、今度はWindows側が反応します。
💡 今後の対策・注意点
もし両方を同時に動かしてテストしたい場合は、どちらか一方のコード(app.listen(3000) など)を書き換えて、別々のポート番号(例: Windows側は3000、WSL2側は3001)で起動させる必要があります。
現在、WindowsとWSL2で別々のアプリを同時に動かそうとして競合していますか?それとも同じアプリの開発環境を移行中でしょうか?
状況に合わせてポートの競合を避ける設定方法や環境の整理方法をご案内できます。
別々のポート番号にする方法を知りたい
Node.jsでポート番号を変更する方法は、プログラムの書き方や使っているフレームワーク(Expressなど)によって異なります。
最も一般的かつ推奨される方法は「環境変数(PORT)を使う方法」です。コードを直接書き換えずに、起動する側のコマンドだけでポートを変更できます。
方法1:環境変数 PORT を使う(最もおすすめ)
コード側で「環境変数があればそれを使い、なければ3000を使う」という記述にしておけば、起動コマンド側で自由にポートを指定できます。
1. コードの修正(共通)
app.listen(または server.listen)の部分を以下のように書き換えます。
javascript
// Expressの場合の例
const PORT = process.env.PORT || 3000;
app.listen(PORT, () => {
console.log(Server is running on port ${PORT});
});
コードは注意してご使用ください。
2. 起動コマンドの変更
コードが上記の状態になっていれば、それぞれのターミナルで以下のようにコマンドを入力して別々のポートで起動できます。
- WSL2側(Linux環境)で「3001」で起動する場合:bash
PORT=3001 node app.jsコードは注意してご使用ください。 - Windows側(PowerShell環境)で「3002」で起動する場合:powershell
$env:PORT=3002; node app.jsコードは注意してご使用ください。 - Windows側(コマンドプロンプト環境)で「3002」で起動する場合:cmd
set PORT=3002 && node app.jsコードは注意してご使用ください。
方法2:コードの引数を直接書き換える
もし「一時的なテストではなく、完全にWindows用とWSL2用でソースコード自体を分けている」という場合は、数値を直接書き換えるのが一番シンプルです。
javascript
// Windows側のソースコード
app.listen(3000, () => { ... });
// WSL2側のソースコード
app.listen(3001, () => { ... });
コードは注意してご使用ください。
方法3:.env ファイルを使う(プロジェクト開発向け)
dotenv というライブラリを使っている場合は、プロジェクトのルートにある .env ファイルの内容を書き換えるだけで変更できます。
- プロジェクト内に
.envという名前のファイルを作成(または編集)します。 - 中身を以下のように設定します。
- Windows側の
.env:textPORT=3000コードは注意してご使用ください。 - WSL2側の
.env:textPORT=3001コードは注意してご使用ください。
- Windows側の
現在作成されているNode.jsのアプリは、Expressなどのフレームワークを使っていますか?
もし上手くポートが変わらない場合は、現在の app.listen や server.listen 周りのコードを教えていただければ、具体的な書き換え方法をご案内します。
