はじめに
これまで３回に渡ってPHPを使った「お問い合わせフォームを作る」を投稿してきました。
その１ その２ その３
その中で色々な方々に「こうした方がいい」というコメントをありがたく頂きました。
その中でもテンプレート読み込みは htmlファイルはrequireの方がいい、というコメントを活用させて、今までの造りとは違う形でこのその４を書こうと思います(テンプレートの読みは文字列読み込みではなくファイル読み込みに変更します朝令暮改)。
やりたい事は、データの受け渡しにおいてセッションを使う事です。
それでは始めましょう。
セッション？？
そもそもセッションて何？
ざっくりと絵で説明します。ざっくりとです。
データの送信
ざっくりすぎますが、ブラウザ側(クライアント側)から今からデータ投げま〜すとリクエストが投げられます。
それを受け取ったサーバはデータを保存し、保存先を特定する一意のID(session id)をブラウザに送り返します。
データの受け取り
ブラウザ側でデータが必要になった場合の流れは以下の通りです。
ブラウザ側(クライアント側)で送ったデータが必要になった場合、cookieに保存されたsession idをリクエストヘッダに含めてリクエストを投げます。
その結果、サーバは受け取ったsession idに合うデータをブラウザ側(クライアント側)に返します。
尚、上記例ではリクエストメソッドはPOSTとしていますが、これ以外のメソッドでも利用されます。
また、session idの保存方法は上述のCookieでの保存方法の他にファイル保存、DB保存などの手段があります。
実装
それでは実装していきましょう
構成
index.php // 入力画面です
index.html // 入力画面用のテンプレートファイルです
confirm.php // 入力画面で入力されたデータを受け取り、データを表示します
confirm.html // 確認画面用のテンプレートです
complete.php // 確認画面からデータを受け取りメール送信し、完了画面を表示します
complete.html // 完了画面のテンプレートです
index.php
<?php
session_start();
$name = "";
$mail = "";
$toiawase = "";
$errorName = "";
$errorMail = "";
$errorToiawase = "";
if(isset($_SESSION['name']) && isset($_SESSION['mail']) && isset($_SESSION['toiawase'])){
$name = !is_null($_SESSION['name']) ? $_SESSION['name'] : "";
$mail = !is_null($_SESSION['mail']) ? $_SESSION['mail'] : "";
$toiawase = !is_null($_SESSION['toiawase']) ? $_SESSION['toiawase'] : "";
}
if(isset($_SESSION['error_name']) && isset($_SESSION['error_mail']) && isset($_SESSION['error_toiawase'])){
$errorName = $_SESSION['error_name'] ? 1 : 0;
$errorMail = $_SESSION['error_mail'] ? 1 : 0;
$errorToiawase = $_SESSION['error_toiawase'] ? 1 : 0;
}
require("index.html");
session_start(); この関数でセッション処理を開始します。
その後、このお問い合わせフォームで使用するセッション値がセットされているかチェックしています。
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>phpでフォーム送信</title>
</head>
<body>
<form action="./confirm.php" method="post">
<div id="contents">
<div id="name">
お名前 <input type="text" name="name" value="<?php echo $name; ?>">
<?php if($errorName) echo "入力に誤りがあります"; ?>
</div>
<div id="mail">
メールアドレス <input type="text" name="mail" value="<?php echo $mail; ?>">
<?php if($errorMail) echo "入力に誤りがあります"; ?>
</div>
<div id="toiawase">
お問い合わせ内容 <textarea name="toiawase"><?php echo $toiawase; ?></textarea>
<?php if($errorToiawase) echo "入力に誤りがあります"; ?>
</div>
</br>
</br>
<input type="submit" value="確認">
</div>
</form>
</body>
</html>
<?php if($errorName) echo "入力に誤りがあります"; ?> これはこの先のconfirm.phpで入力エラーがある、と判断された場合にエラー用のセッション値に値が入ります。このエラー用のセッション値が空でなかった場合に、エラー文字列入力に誤りがありますを表示しています。（もちろんエラー文字列は好きなものを設定可能です）
confirm.php
<?php
session_start();
$name = validateData("name");
$mail = validateData("mail");
$toiawase = validateData("toiawase");
if(!filter_var($mail, FILTER_VALIDATE_EMAIL)){
$_SESSION['error_mail'] = 1;
}
if($_SESSION['error_name'] || $_SESSION['error_mail'] || $_SESSION['error_toiawase']){
header("Location: ./index.php");
exit();
}
require('confirm.html');
function validateData($key){
if(is_null($_POST["$key"]) || empty($_POST["$key"]) || !is_string($_POST["$key"])){
$_SESSION["$key"] = $_POST["$key"];
$_SESSION["error_" . $key] = 1;
return "";
}else{
$_SESSION["$key"] = $_POST["$key"];
$_SESSION["error_" . $key] = 0;
return $_POST["$key"];
}
}
confirm.php ではまず入力画面で入力されたデータのチェックを行います。ここではvalidateDataという関数を使って「名前」「メールアドレス」「問い合わせ内容」のチェックを行っています。
チェックの結果、エラーがあった場合エラー用のセッション値に1を代入しています。
if($_SESSION['error_name'] || $_SESSION['error_mail'] || $_SESSION['error_toiawase'])
こちらの分岐で入力エラー時はindex.phpに戻す(リダイレクトさせる)ためです。
入力エラーがなければ、次のconfirm.htmlを読み込み表示します。
confirm.html
<!DOCTYPE html>
<html>
<head>
<meta charset='UTF-8'>
<title>確認画面</title>
</head>
<body>
お名前：<?php echo $name; ?>
</br>
メールアドレス：<?php echo $mail; ?>
</br>
お問い合わせ内容
</br>
<?php echo $toiawase; ?>
</br>
</br>
<form action='./complete.php' method='post'>
<input type='button' onclick='history.back()' value='戻る'>
<input type='submit' value='確認'>
</form>
</body>
</html>
confirm.htmlでは入力画面で入力されたデータを表示します。
complete.php
<?php
session_start();
$name = $_SESSION['name'];
$mail = $_SESSION['mail'];
$toiawase = $_SESSION['toiawase'];
$mailHeader = "From: from@from.com";
$mailSubject = "お問い合わせありがとうございます";
$mailBody = $name . "様 お問い合わせありがとうございます";
$mailBody .= "¥n";
$mailBody .= "ご返信まで～～～～";
mail($mail, $mailSubject, $mailBody, $mailHeader);
require("./complete.html");
$_SESSION = array();
session_destroy();
complete.phpでは入力画面から確認画面へと渡ってきたデータを受け取ってメール送信処理を行ってます。
そして、完了画面を表示しています。
最後に$_SESSION = array(); session_destroy();という処理がありますが、前者ではプログラム内の$_SESSION内のデータを消しています。後者ではサーバ上のセッションデータを削除しています。
complete.html
<!DOCTYPE html>
<html>
<head>
<meta charset='UTF-8'>
<title>Insert title here</title>
</head>
<body>
<?php echo $name; ?>さん、お問い合わせありがとうございます。
</body>
</html>
すみません、、、、「ありがとうございます」だけを表示するテンプレートです。。。
終わりに
4回もつかってにわたってPHPでの「お問い合わせフォーム」を作成しました。
その１ では、ただ動くものを作りました。
その２ では、PHPとHTMLを分けました(テンプレート化しました)
その３ では、入力チェックを行いました。
そして今回で セッション処理 を使うようにしました。
とりあえず、この「お問い合わせフォーム」は今回で終了です。内容におかしなところがあったらコメントでご指摘お願いします。
次は何やる？
この「お問い合わせフォーム」の味気ない画面をなんとかするべくbootstrapを使ってちょっとはマシなものにしようかと思いましたが、フロントエンドはど素人なのでやめておきます。
ローカルでの 開発環境の構築 か Laravelの導入 か jQuery やろうと思います今更jQuery???