2018年10月時点のXAMPPインストールと使い方

XAMPPインストールと使い方 PHP

PHPやMySQLをローカルで試したい方向けの定番環境XAMPP（ザンプ）のインストールと使い方です。
XAMPPインストール後、サーバ（Apache）を起動してPHPプログラムを動かすまでを解説しています。

ちなみにXAMPPは

・Apache（サーバ）
・Maria DB（データベース：以前はMySQLでした）
・PHP（サーバサイドプログラミング言語）
・Perl（サーバサイドプログラミング言語）

を一度にインストールしてくれるパッケージです。XAMPPは、それぞれの頭文字をとった名称です。（Xは何処へ行った？！）

この記事は2018年10月時点の最新バージョンXAMPP7.2.10を元に解説しています。
動作確認OS：Windows10

XAMPPのダウンロード

ダウンロードは、以下のApache Friendsのサイトから行います。

Apache Friends

トップ画面からダウンロードが出来ます。
Windows版で解説させて頂きますが、他のバージョンでもほぼ同じ手順です。

XAMPPインストールと使い方

Windows向けXAMPP7.2.10を選択してダウンロードします。
※どうやらXAMPPのバージョンは、同時にインストールされるPHPのバージョンと同期しているようです。

XAMPPインストールと使い方
ファイルの保存を選択します。（Chromeだと自動的にダウンロードされます）

ダウンロードしたアイコンはこんな感じです。
XAMPPインストールと使い方

いつもXAMPPをダウンロードするときに思うのですが、ダウンロード後に表示されるXAMPPのサイトに「素晴らしい！」と大きな文字がある点が宗教っぽく感じますね。

ウイルスチェックは必ずしましょう！
アイコンを右クリックしてWindows Defenderでスキャンする…を選択します。
XAMPPインストールと使い方

XAMPPのインストール

ダウンロードしたXAMPPアイコンをダブルクリックしてインストールを開始します。

たぶんWindowsであれば、以下のちょっと不安になるメッセージが表示されるはずです。
XAMPPインストールと使い方

C:\ProgramFiles(x86)以下にインストールするときは、管理者モードでインストールしないとだめだよ、みたいな感じなのですが、インストール先をC:\XAMPPにすれば特に問題ありませんので（この後のインストール途中で出てきます）そのままOKを押します。（というかOKしか押せない）

この先は、インストール開始までのお決まりの儀式となります。

Setup – XAMPP ウインドウ画面
XAMPPインストールと使い方

Nextを選択します。

Select Components 画面
XAMPPインストールと使い方

全て選択されているのでそのままNextを選択します。（意味が理解できる方はカスタマイズしてください）

Installation Folder 画面
XAMPPインストールと使い方

ここが一番大事です。
Select a folder の文字列がC:\XAMPPとなっていることを確認してからNextを押してください。

Bitnami for XAMPP 画面
XAMPPインストールと使い方
いわゆるコマーシャルです。
Learn more about Bitnami for XAMPP のボックスにチェックが入っていると以下のページがブラウザに表示されます。
XAMPPインストールと使い方

見たくなければチェックを外してからNextを押してください。

Ready to Install 画面
XAMPPインストールと使い方
やっとここまで来ました。Nextを押すとインストールが実際に始まります。

インストール中の画面
XAMPPインストールと使い方

わたしのパソコンでは、大体5分くらい掛かりました。

Finishボタンが表示されたらインストール完了です。
Do you want to start the Control Panel now?のボックスにチェックが入っていると思います。

XAMPPインストールと使い方

そのままの状態でFinishを押してください。

XAMPPコントロールパネルが起動しますが、初回だけ以下のウインドウが表示されます。

Language
XAMPPインストールと使い方
XAMPPコントロール画面に使用する言語の選択です。英語とドイツ語しか選べません。
お好きな方をクリックしてSaveを押して下さい。（後でXAMPPコントロールパネルからも変更できます）

XAMPPコントロールパネルが起動しますので、次の手順で動作確認をして下さい。

XAMPP Control Panel 画面（起動直後の画面）
XAMPPインストールと使い方

サーバ（Apache)を起動と動作確認

サーバの起動は、XAMPPコントロールパネルより行います。
XAMPPコントロールパネルの起動は、Windowsの場合

スタートメニューをクリック　XAMPP　＞　XAMPP Control Panel を選択してください。
XAMPPインストールと使い方

XAMPP Control Panel 画面
XAMPPインストールと使い方

Moduleの欄の一番上がApache（サーバ）になります。
ActionsのStartボタンを押すとサーバが起動します。
XAMPPインストールと使い方

Apache起動後の状態
XAMPPインストールと使い方

正しく起動できるとApacheの文字の背景色が緑色に変わります。（もし、赤や黄色の状態であれば正しくApacheが起動できていません。メッセージが下のボックスに表示されてますので確認をしてください。基本的にインストールからやり直す必要があります）

ブラウザで動作確認をしてみます。
動作確認方法は2種類あります。

動作確認方法１
ブラウザを起動しURL欄に「localhost」と打ち込んでエンターキーを押す
動作確認方法２
XAMPPコントロールパネルのApache欄のAdminボタンを押す
XAMPPインストールと使い方

どちらの場合も以下の画面がブラウザに表示されればApacheの動作確認はOKです。
XAMPPインストールと使い方

ちなみにURL欄が自動的にlocalhost/dashboard/となりますが、これはC:\XAMPP\htdocs\フォルダに最初から存在するindex.phpというPHPプログラムが動作しているため自動的にC:\XAMPP\htdocs\dashboard\index.htmlに飛ばされて表示しているだけです。

これであなたのパソコンがサーバとして動作できるようになりました。
PHPやPerlなどのサーバサイドプログラミング言語が動作できる環境が整ったと同時に同じローカルなネットワークにつながった端末に対してあなたのパソコンの一部が公開状態になった、ということでもあります。

XAMPP公開フォルダは、C:\XAMPP\htdocs（XAMPPをc:\XAMPPにインストールした場合）

取り扱いには十分注意して下さい。
実際に公開するフォルダについてや公開方法は、以下を参考にして下さい。

XAMPP公開フォルダの使い方

XAMPPをインストールし、Apacheを起動させると

C:\XAMPP\htdocs

以下が公開状態になります。

具体的には、あなたの端末名が「melon」だったとすると

http://melon/

で、あるいはIPアドレスが192.168.0.7 だったとすると

http://192.168.0.7/

で相手からアクセス出来るようになります。

相手からは、htdocs以下のHTMLファイルやPHPプログラムにアクセス出来るようになるということです。

まずインストールしたXAMPPフォルダの中身をのぞいてみて下さい。
XAMPPコントロールパネルからApacheを起動させた状態でブラウザから「localhost」にアクセスするとまずApacheがC:\XAMPP\htdocs\フォルダをチェックしに行きます。（写真は、C:\XAMPPにインストールした場合）

XAMPPインストールと使い方

htdocs内の初期状態は、このようなファイル構成です。

XAMPPインストールと使い方

Apacheは、http://localhost/にアクセスがあった場合、htdocsフォルダ内の

index.php　＞　index.html　の順でファイルチェックします。

初期状態では、index.phpしか存在しませんので

以下のデフォルトページが表示される訳です。
XAMPPインストールと使い方

試しにhtdocsフォルダ内のindex.phpを名前変更して新規にindex.htmlを作ったとします。
XAMPPインストールと使い方

index.htmlの中身はこんな感じにしておきます。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>XAMPPトップページ</title>
</head>
<body>
	<h1>XAMPPトップページ</h1>
	<p>こちらは http://localhost/index.html です</p>
</body>
</html>

その後、ブラウザのURL欄に「localhost」と入力してアクセスしてみて下さい。

XAMPPインストールと使い方

こんな感じで C:\XAMPP\htdocs\ フォルダにある index.html の内容が表示されていればトップページとして認識されたことになります。

index.htmlとindex.phpが同時に存在した場合は、index.phpが優先されてしまうので注意して下さい。

HTMLやCSSファイルのみを使ったホームページの公開だけであればここまでの知識で十分です。

例えばhtdocs以下のにimageフォルダを作ってtest.jpgを配置したらアクセスURLは、

http://localhost/image/test.jpg

となります。フォルダがURLの区切りというインターネット上のファイルと同じ仕組みです。
これでなんとなくサーバというものが見えてきたのではないでしょうか。
最後に簡単なPHPプログラムを動作させてみます。

PHPプログラムを動作させる

XAMPPの公開フォルダhtdocsに動作確認用のPHPファイルを作って保存します。
エディタは何でも構いませんが、文字コード（エンコード）形式はUTF-8で保存するようにして下さい。

running_check.php

<?php
	echo "<p>動いてるよ～</p>";
?>

保存したらブラウザのURL欄に「http://localhost/running_check.php」と入力してエンターキーを押して下さい。

表示結果
XAMPPインストールと使い方

こんな感じでPHPプログラムは、拡張子を～.phpで保存してブラウザから直接ファイル名で呼び出すことが基本です。
ちょっと簡単すぎましたので、もうちょっとPHPらしくしたのが以下のプログラムです。

running_check_xampp.php

<?php
	// XAMPP&PHP動作チェック
	$host = $_SERVER["HTTP_HOST"];
	$user_agent = $_SERVER["HTTP_USER_AGENT"];

	echo "<p>こんにちは。</p>";
	echo "<p>現在アクセスしているホスト: $host</p>";
	echo "<p>あなたの使っているブラウザ: $user_agent</p>";
	echo "<p>PHPが動作しています ..... check ok.</p>";
?>

表示結果
XAMPPインストールと使い方

どうですか？
サーバ側からは、相手の情報が筒抜けであることが分かります。
ここまで出来たらあとは、PHPでもPerlでも実際にプログラムを作って動作確認してみて下さい。

以上、XAMPPインストール後、サーバ（Apache）を起動してPHPプログラムを動かすまででした。

コメント

タイトルとURLをコピーしました