背景

WindowsのWSL2環境でRailsアプリを開発しています。開発しているWebアプリに関してAppleのSafariブラウザでの動作確認が必要になりました。そこで、同一LAN内にあるiPhoneやiPadといった別デバイスから、WSL2環境においてrails serverコマンドで走らせたサーバへ、アクセスできるようにしました。

手順

LAN接続の設定

後述のファイアウォールの設定にて、プライベートネットワークに限定する設定をする場合には、Railsサーバを走らせているPCのLAN設定で、ネットワーク プロファイルをプライベートにしておきます。

WSL2で走っているLinuxのIPアドレスの確認

ifconfigの出力のinetのところなどで、WSL2で走っているUbuntuなどのLinux OS側のIPアドレスを確認し、転送先アドレスとして控えます。

LinuxのIPアドレスが正しいことの確認

まず、bin/rails server -b 0.0.0.0でWSL2上でRailsサーバを起動します。
次に、このRailsサーバに、WSL2環境ではなくWindows上で普通に走っているブラウザから、先ほど調べたWSL2で走っているLinuxのIPアドレスに対し http://（LinuxのIPアドレス）:3000/ というようなアドレス（ここではポート番号を3000としていますが、別のポートをRailsサーバに用いている場合はそのポート番号に変更して下さい）でアクセス出来ることを確認します。
ここでアクセスに失敗するようでは何かしらが間違っていますので、まずはこのようにアクセス出来るようにしましょう。

ホストOSであるWindowsのIPアドレスの確認

ipconfigなどで、Windows側、つまり、ホストOS側のLAN上でのIPアドレスを確認し、転送元アドレスとして控えます。

ポートフォワーディングの設定

管理者権限で以下のコマンドを実行します。なお、特に理由が無ければ、転送元ポートは転送先ポートと同じ（3000）で大丈夫です。

netsh interface portproxy add v4tov4 listenaddress=＜転送元（Windows）のIPアドレス＞ listenport=＜転送元ポート＞ connectaddress=＜転送先（Linux）のIPアドレス＞ connectport=＜転送先ポート＞

ファイアウォールの設定

Windowsのファイアウォールの設定にて、「受信の規則」として以下の設定を追加します。

• プロトコルの種類：「TCP」
• ローカルポート： 「特定のポート」「3000（転送元ポート）」
• リモートポート： 「すべてのポート」

なお、ファイアウォールの設定にて、プライベートネットワークに限定したり、テスト時以外は無効にしたりするなど、セキュリティには十分に配慮をして下さい。

接続確認

同一LAN内の別デバイスから、 http://（WindowsのIPアドレス）:（転送元ポート）/ というようなアドレスでアクセス出来ることを確認します。

参考情報

• Windowsでのnetshを用いたポートフォワーディングの設定
• https://gunmagisgeek.com/blog/other/7171

別デバイスからhttpsでrails serverにアクセスする方法

前述の方法で別デバイスからhttpでアクセスできるようになりますが、httpsでアクセスする必要がある場合には、 local-ssl-proxyを使ってhttpsをhttpに振り向けることで、httpsアクセスが可能になります。具体的な方法は以下をご覧ください。 なお別デバイスからhttpsでアクセスするには、前述のポートフォワーディングとファイアウォールの設定をhttpsのポート番号で行う必要があります。

• local-ssl-proxyを使ってhttpsでhttp://localhost:3000/へアクセスする方法