NANIGE BLOG
2024.09.16
2024.09.17

XAMPPを使用して他のPCからアクセスする方法

今回はXAMPPを使用して他のPCからアクセスする方法についてお話します。

前提

今回はXAMPPをwindowsにインストール済でwebアプリケーションなどのプロジェクトファイルが準備できた段階からのお話になります。

完成形

今回の設定が完了すると以下のようにIPアドレスとポートを指定すると他のPCからアクセスができるようになります。

画像ファイル1

具体例を混ぜながらその設定方法をお伝えします。

設定方法

httpd.conf

まずはXAMPPのconfigファイルの一つであるhttpd.confを編集します。

変更点は2か所です。

1か所目

1か所目はlistenするポート番号を指定します。

デフォルトでは80番ポートが記載されていますので、その下に受け取るポート番号を記載しましょう。

今回の例では9000番としています。

# Listen: Allows you to bind Apache to specific IP addresses and/or
# ports, instead of the default. See also the <VirtualHost>
# directive.
#
# Change this to Listen on specific IP addresses as shown below to 
# prevent Apache from glomming onto all bound IP addresses.
#
#Listen 12.34.56.78:80
Listen 80
Listen 9000

2か所目

2か所目はポートごとにどのディレクトリを指定するかを記載します。

以下のコードを任意の場所に記載しましょう。

※今回はCドライブ直下にweb_projectというディレクトリがあると仮定しています。

このディレクトリ名は適宜変更してください。

<VirtualHost *:9000>
DocumentRoot "C:/web_project"
<Directory "C:/web_project">

    Options Indexes FollowSymLinks Includes ExecCGI

    AllowOverride All

    Require all granted
</Directory>
</VirtualHost>

上記の2か所を変更したら保存しましょう。

Apacheを再起動

もしApacheが起動している場合は一度停止させてもう一度起動させてください。

Apacheを起動している状態ではhttpd.confを変更して保存しても反映されません。

起動したときに以下のようにポート番号が記載されていれば成功です。

画像ファイル2

接続確認

ではブラウザを開いてアドレスバーに対象のPCのアドレスとポートを打ち込んでみましょう。

192.168.1.120:9000

※IPアドレスはご自身のPCのものを打ち込んでください。

これで用意したファイルが表示されたら成功です。

次はLaravelプロジェクトの場合をご紹介します。

Laravelの場合

Laravelを使用してローカル環境でwebサーバーを立てる場合

通常は以下のようなコマンドを叩くかと思います。

php artisan serve

しかし今回のやり方ではいちいちこのコマンドを打つことなく、

XAMPPを起動さえしていればLaravelのプロジェクトを表示することができます。

その他にも以下のようなメリットがあります

メリット

  • 複数のプロジェクトが存在する場合同時に表示をすることができる。
  • 簡易サーバーではないため重い負荷のものにも対応できる。
  • 他のPCからアクセスができる。

設定方法

設定方法はほとんど変わりません。

注意する点はディレクトリの指定です。

変更箇所は2か所です。

1か所目

1か所目は同じです。

# Listen: Allows you to bind Apache to specific IP addresses and/or
# ports, instead of the default. See also the <VirtualHost>
# directive.
#
# Change this to Listen on specific IP addresses as shown below to 
# prevent Apache from glomming onto all bound IP addresses.
#
#Listen 12.34.56.78:80
Listen 80
Listen 9000

2か所目

2か所目もほぼ同じですがLaravelプロジェクトの場合はプロジェクト名の下のpublicディレクトリを指定しましょう。

今回はCドライブ直下にlaravel_projectというプロジェクトディレクトリがある場合を想定しています。

<VirtualHost *:9000>
DocumentRoot "C:/laravel_project/public"
<Directory "C:/laravel_project/public">

    Options Indexes FollowSymLinks Includes ExecCGI

    AllowOverride All

    Require all granted
</Directory>
</VirtualHost>

あとは同じようにApacheを再起動させて確認してみましょう。

ABOUT ME
たけし
元教育業界で講師を務め

未経験で転職を成功。

現在はWEBを中心に

SEとして活躍中

djangoやlaravelを主に扱う

保有資格:

・ AWS SAA(ソリューションアーキテクトアソシエイト)

・統計検定2級

・日商簿記2級
【解決方法】User Profile Serviceサービスによるサインインの処理に失敗しました。ユーザープロファイルを読み込めません
わかりやすく解説!ALBでEC2にアクセスする方法
意外に難しい…?クアラルンプール国際空港から市内への移動
ABOUT ME
たけし
元教育業界で講師を務め

未経験で転職を成功。

現在はWEBを中心に

SEとして活躍中

djangoやlaravelを主に扱う

保有資格:

・ AWS SAA(ソリューションアーキテクトアソシエイト)

・統計検定2級

・日商簿記2級