GETとPOST
私たちはよく「Webサイトへアクセスする」といいますが、よく見てみるとアクセスの目的がいろいろあります。
- Webサイトから情報を取得する（単なるページの参照、検索など）
- Webサイトへ情報を送る（会員登録、注文登録など）
それらのアクセスは、ある決め事にもとづいて通信が行われます。
その決め事をプロトコル（通信規約）といいます。
ブラウザとユーザ間で利用するプロトコルはHTTPです。
HTTPには、アクセスする種類に応じてHTTPメソッドが決められています。
本章ではHTTPメソッド、その中でもGETやPOST、そしてPHPでの実装の仕方を学習します。
このGETやPOSTのことをHTTPメソッドと言います。
それでは早速、HTTPメソッドを用いたプログラムを記述していきましょう！
PHPブロックと再代入
db_app/get_post/study内にindex.phpを作成し、以下のコードを記述してください。
ファイルの作成方法を忘れた方はこちらを参照ください。
<?php $message = "Hello PHP in HTML" ?>
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>お問い合わせフォーム</title>
</head>
<body>
<?php echo $message ?>
</body>
</html>コードが書けたらindex.phpをプレビューしてみましょう。
プレビュー方法を忘れてしまった方はこちらを参照ください。
Hello PHP in HTML が表示されていれば成功です。
PHPはHTMLの中に書くことができます。
その時、PHPのコードは <?php ?> というPHPブロックの内側のコードを記述します。
また、PHPブロック内の記述はファイルの拡張子が .php でなければ正しく動作しないので注意してください。
PHPとHTMが記述されたファイルなので少し難しく見えますが、PHPブロックを抜き出してPHPだけのプログラムにしてみると以下のようになります。
<?php
$message = "Hello PHP in HTML";
echo $message;“Hello PHP in HTML” という文字列を $message という変数に代入し、それを出力するというプログラムなのでそれほど難しくはないですね。
PHPとHTMLが混在するファイルは <?php ?> のようにPHPブロックを正しく書く必要がありますが、
PHP単体のファイルではPHPブロックの閉じ (?>)を省略することができます。
また、PHPブロック内の記述が1行で完結する場合は、文末の ; (セミコロン)を省略できます。
今度は $message の値を途中で “Hello PHP” にすると表示がどうなるか確認してみましょう。
<?php $message = "Hello PHP in HTML" ?>
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>お問い合わせフォーム</title>
</head>
<body>
<?php $message = "Hello PHP" ?>
<?php echo $message ?>
</body>
</html>プレビューで Hello PHP が表示されましたか？
PHPは上からプログラムが実行されるため、途中で $message の値が “Hello PHP” に上書きされたことで、
表示された内容が Hello PHP になりました。
同じ変数に値を代入し直すことを 再代入 といいます。
再代入は今後も使用していくのでしっかりと理解しておきましょう。
フォームの雛形を作成しよう
GETとPOSTの動きを確認するために必要なフォームの実装をしていきます。
まずはフォームを作る前に先程の練習で使用した記述を削除しておきましょう。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>お問い合わせフォーム</title>
</head>
<body>
</body>
</html>今回は「名前」「メールアドレス」「お問い合わせ内容」、この3つを送信できるフォームを作成します。
まずはformタグでフォームの大枠を作っておきます。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>お問い合わせフォーム</title>
</head>
<body>
<form>
</form>
</body>
</html>次に「入力項目名」「テキストボックス」「送信ボタン」を作成します。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>お問い合わせフォーム</title>
</head>
<body>
<form>
<table>
<tr>
<th>お名前</th>
<td><input type="text" name="name" /></td>
</tr>
<tr>
<th>メールアドレス</th>
<td><input type="email" name="email" /></td>
</tr>
<tr>
<th>お問い合わせ内容</th>
<td><textarea name="body"></textarea></td>
</tr>
<tr>
<td><button>確認画面へ</button></td>
</tr>
</table>
</form>
</body>
</html>tableタグはエクセルの様な表を作るときに使用するタグです。
thタグは各項目のタイトルを、tdはマスに入るデータを、trはthとtdを囲うタグです。
ユーザーが入力できるようにinputタグとtextareaタグをformタグ内に配置しました。
inputタグは閉じタグがないのにtextareaタグには閉じタグがあることで、
HTMLの理解が難しくなってしまったかもしれませんが、
HTMLには閉じタグがない 空タグ と呼ばれるタグが存在します。
名前やメールアドレスのように改行する必要がない場合はinputタグ、
複数行入力する可能性がある場合はtextareaタグという風に使い分けましょう。
これでフォームが完成しました。
GETでリクエストしよう
GETでリクエストできる様に準備をしていきます。
まずはformタグにaction属性とmethod属性を追加します。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>お問い合わせフォーム</title>
</head>
<body>
<form action="index.php" method="GET">
<table>
<tr>
<th>お名前</th>
<td><input type="text" name="name" /></td>
</tr>
<tr>
<th>メールアドレス</th>
<td><input type="email" name="email" /></td>
</tr>
<tr>
<th>お問い合わせ内容</th>
<td><textarea name="body"></textarea></td>
</tr>
<tr>
<td><button>確認画面へ</button></td>
</tr>
</table>
</form>
</body>
</html>action属性はボタンを押した後に遷移する先、method属性はリクエストの種類を決定します。
今回はボタンを押した後、GETでリクエストを送り、index.phpに戻る様に設定しています。
GETでリクエストした内容を取得するには $_GET をしようします。
$_GET の中身が確認できるように以下の様に編集しましょう。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>お問い合わせフォーム</title>
</head>
<body>
<pre>
<?php var_dump($_GET) ?>
</pre>
<form action="index.php" method="GET">
<table>
<tr>
<th>お名前</th>
<td><input type="text" name="name" /></td>
</tr>
<tr>
<th>メールアドレス</th>
<td><input type="email" name="email" /></td>
</tr>
<tr>
<th>お問い合わせ内容</th>
<td><textarea name="body"></textarea></td>
</tr>
<tr>
<td><button>確認画面へ</button></td>
</tr>
</table>
</form>
</body>
</html>preタグは改行した部分をそのまま表示してくれるタグです。
HTML上にソースコードを表示するときによく使用されます。
今回は var_dump を使用して $_GET の詳細を出力するようにしています。
プレビューから画像の通りに入力し、ボタンを押して送信しましょう。
送信が完了すると var_dump によって、 $_GET の中身の詳細が出力されます。
array(3) {
[“name”]=>
string(4) “test”
[“email”]=>
string(13) “test@test.com”
[“body”]=>
string(8) “testtest”
}
よく見ると、連想配列のキーとバリューの形式になっていますね。
「name」「email」「body」それぞれに紐づくバリューも表示してみましょう。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>お問い合わせフォーム</title>
</head>
<body>
<pre>
<?php
var_dump($_GET);
echo $_GET["name"] . "\n";
echo $_GET["email"] . "\n";
echo $_GET["body"] . "\n";
?>
</pre>
<form action="index.php" method="GET">
<table>
<tr>
<th>お名前</th>
<td><input type="text" name="name" /></td>
</tr>
<tr>
<th>メールアドレス</th>
<td><input type="email" name="email" /></td>
</tr>
<tr>
<th>お問い合わせ内容</th>
<td><textarea name="body"></textarea></td>
</tr>
<tr>
<td><button>確認画面へ</button></td>
</tr>
</table>
</form>
</body>
</html>再度、プレビューで同じ内容を入力して送信しましょう。
すると、入力した内容が表示されるはずです。
$_GET が連想配列になっていることがわかりましたが、その連想配列のキーはどこで決まっているのでしょうか？
これはformタグ内にある、inputタグやtextareaタグのname属性で決まります。
例えば、textareaタグのname属性をmessageに変更した場合、
$_GETからtextareaに入力された値を取り出すには $_GET[“message”]のようにする必要があります。
ここでフォームを送信した後にURLに注目してみましょう。
フォームで入力した値がURLの末尾に組み込まれていますね。
このようにGETでリクエストを送ると入力した内容が見えるという特徴を持っています。
POSTでリクエストしよう
今度はPOSTでリクエストできるように、formタグのmethodをPOSTに修正します。
POSTでリクエストした内容を取得するには $_POST を使用します。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>お問い合わせフォーム</title>
</head>
<body>
<pre>
<?php
var_dump($_POST);
echo $_POST["name"] . "\n";
echo $_POST["email"] . "\n";
echo $_POST["body"] . "\n";
?>
</pre>
<form action="index.php" method="POST">
<table>
<tr>
<th>お名前</th>
<td><input type="text" name="name" /></td>
</tr>
<tr>
<th>メールアドレス</th>
<td><input type="email" name="email" /></td>
</tr>
<tr>
<th>お問い合わせ内容</th>
<td><textarea name="body"></textarea></td>
</tr>
<tr>
<td><button>確認画面へ</button></td>
</tr>
</table>
</form>
</body>
</html>今度は自分の好きな文字を入力して送信してみましょう。
POSTはGETの時のように、送信した内容がURLに含まれません。
このようにGETとPOSTには明確な違いがあります。
Webサイトから情報を取得するときはGET、Webサイトへ情報を送るときはPOSTを利用するので覚えておきましょう。
