menu
menu

Captcha認証付メールフォーム | Webデザインラボ

キーワード検索

11月のアクセストップ10

  1. ( 1-) スマホサイトの作成・基本編
  2. ( 3↑) CSSだけでドロップダウンメニュー
  3. ( 2↓) CSSだけでサイズ可変・スマホ対応のアコーディオン
  4. ( 4-) HTML5・ページ作成の基本
  5. ( 5-) jQueryでドロップダウンメニュー
  6. ( 6-) スマホ・タブレット・PCの振り分けいろいろ
  7. ( 9↑) 表示しているブラウザの高さを取得してCSSのheightに指定
  8. ( 8-) Windows 10にApache2.4 VC11をインストール
  9. ( 7↓) JavaScriptで新しいウィンドウを開く
  10. (-↑) CSSだけでブロック要素の表示非表示(トグルボタン)
  • facebook6
  • はてなブックマーク3
  • Google+3
  • Pocket0
  • Twitter0

Captcha認証付メールフォーム

  • Labs

PHP

こんにちは(・∀・)

 PHPを使用したサンプルをご紹介します。今回はCaptcha認証付PHPメールフォームです。

 PHP5.3以降のバージョンには対応しておりません。PHP5.3以降のバージョンではキャプチャ認証が正しく動かない現象がでておりますので通常のメールフォームをご利用ください。

 メールアドレス再入力付メールフォーム

 メールフォーム

Captcha認証

 jQueryのCaptcha認証はjQuery Real Personを使用します。詳しくはjQueryとPHPでCaptcha認証をご覧ください。

サンプルデモ

 サンプルデモはこちら!


HTML

<div class="mailform">
<form action="mail.php" method="post" enctype="application/x-www-form-urlencoded">
<p><input type="hidden" name="action" value="post"></p>
<table>
<tr>
<td class="lt">&nbsp;</td>
<td class="rt">お問い合わせフォーム</td>
</tr>
<tr>
<td class="lt">お名前<span class="rq">*</span></td>
<td class="rt"><input type="text" name="name" id="name"></td>
</tr>
<tr>
<td class="lt">電話番号</td>
<td class="rt"><input type="text" name="phone" id="phone"> (例 : 03-1234-5678)</td>
</tr>
<tr>
<td class="lt">メール<span class="rq">*</span></td>
<td class="rt"><input type="text" name="email" id="email"></td>
</tr>
<tr>
<td class="lt">メール<span class="rq">*</span></td>
<td class="rt"><input type="text" name="email2" id="email2"> (確認のため再入力)</td>
</tr>
<tr>
<td class="lt">コメント<span class="rq">*</span></td>
<td class="rt"><textarea name="comment" id="comment" rows="5" cols="50"></textarea></td>
</tr>
<tr>
<td class="lt">&nbsp;</td>
<td class="rt"><!--captcha認証--><p class="captchaimg"><input type="text" id="defaultReal" name="defaultReal"></p></td>
</tr>
<tr>
<td class="lt">&nbsp;</td>
<td class="rt"><input type="submit" id="submit" value="Submit"><input type="reset" id="reset" value="Reset"></td>
</tr>
</table>
</form>
<!--mailform--></div>
CSS

.mailform {
	width: 580px;
	text-align: left;
	background-color: #ccccff;
	margin: 0 auto;
	padding: 10px;
}
.mailform table {
	width: 580px;
	font-size: 12px;
	border-collapse: collapse;
}
.mailform table td {
	padding: 5px;
}
.mailform .lt {
	width: 90px;
	background-color: #ccccff;
	text-align: right;
}
.mailform .rt {
	width: 470px;
	background-color: #ccccff;
}
.mailform .rq {
	color: #ff0000;
}
.mailform .rc {
	color: #0000ff;
}
.mailform .rmr {
	color: #ff0000;
	margin: 0 0 10px 0;
}
.mailform .rmb {
	color: #0000ff;
	margin: 0 0 10px 0;
}
.mailform .rt input {
	float: left;
}
.mailform #name,
.mailform #phone,
.mailform #email,
.mailform #email2 {
	width: 250px;
	height: 20px;
}
.mailform #comment {
	width: 450px;
	height: 100px;
}
.mailform #submit,
.mailform #reset,
.mailform #back {
	width: 80px;
	height: 25px;
	margin-right: 5px;
}
PHP

 メール送信先を受け取りたいメールアドレスに変更してください。


<?php
//captcha認証
function rpHash($value) {
$hash = 5381;
$value = strtoupper($value);
for($i = 0; $i < strlen($value); $i++) {
$hash = (($hash << 5) + $hash) + ord(substr($value, $i));
}
return $hash;
}
?>
<div class="mailform">
<?php
/*メール送信先(ご利用のメールアドレスに変更してください)*/
$to = "example@example.com";
/*タイトル*/
$subject = "お問い合わせ";
/*入力フォームからのデータを格納*/
$action = $_POST["action"];
$name = $_POST["name"];
$phone = $_POST["phone"];
$email = $_POST["email"];
$email2 = $_POST["email2"];
$comment = $_POST["comment"];
/*特殊文字変換*/
$name = htmlspecialchars($name);
$phone = htmlspecialchars($phone);
$email = htmlspecialchars($email);
$email2 = htmlspecialchars($email2);
$comment = htmlspecialchars($comment);
/*改行文字挿入*/
$comment = nl2br($comment);
$comment = str_replace("\r", "", $comment);
$comment = str_replace("\n", "", $comment);
$btn1 = "<input type=\"button\" id=\"back\" value=\"戻る\" onclick=\"history.go(-1)\">";
if($action == "post"){
if(!preg_match('/[\w.-]+\@[\w.-]+\.[a-zA-Z]{2,3}/', $_POST['email'])){
/*エラーコメント1*/
if($name == null){
$name = "<span class='rq'>お名前を入力してください</span>";
}
if($email == null){
$email = "<span class='rq'>メールアドレスを入力してください</span>";
}else{
$email = "<span class='rq'>入力内容が正しくありません</span>";
}
if($comment == null){
$comment = "<span class='rq'>コメントを入力してください</span>";
}
if(rpHash($_POST['defaultReal']) == $_POST['defaultRealHash']) {//captcha認証
$cap = "<p style='color: green;'>認証コードが確認できました</p>";
} else {
$cap = "<p style='color: red;'>認証コードを正しく入力してください</p>";
}
//$cap = "入力エラー";
$conf = NULL;
$btn2 = NULL;
}elseif($name && $email && ($email2 == $email) && $comment){
if(rpHash($_POST['defaultReal']) == $_POST['defaultRealHash']) {//captcha認証
$cap = "<p style='color: green;'>認証コードが確認できました</p><p>入力内容の確認</p>";
//$cap = "入力内容の確認";
$conf = "入力内容が正しければ送信ボタンを押してください";
$btn2 = "<input type=\"submit\" name=\"submit\" id=\"submit\" value=\"送信\">";
} else {//captcha認証
$cap = "<p style='color: red;'>認証コードを正しく入力してください</p>";
//$cap = "入力エラー";
$conf = NULL;
$btn2 = NULL;
}
}else{
/*エラーコメント2*/
if($name == null){
$name = "<span class='rq'>お名前を入力してください</span>";
}
if($email2 == null){
$email = "<span class='rq'>確認メールアドレスを入力してください</span>";
}elseif($email != $email2){
$email = "<span class='rq'>メールアドレスが正しく入力されているか確認してください</span>";
}
if($comment == null){
$comment = "<span class='rq'>コメントを入力してください</span>";
}
if(rpHash($_POST['defaultReal']) == $_POST['defaultRealHash']) {//captcha認証
$cap = "<p style='color: green;'>認証コードが確認できました</p>";
} else {
$cap = "<p style='color: red;'>認証コードを正しく入力してください</p>";
}
//$cap = "入力エラー";
$conf = NULL;
$btn2 = NULL;
}
/*送信メール確認用画面*/
echo "<form action=\"mail.php\" method=\"post\">\n";
echo "<table>";
echo "<input type=\"hidden\" name=\"action\" value=\"send\">";
echo "<tr><td class=\"lt\">&nbsp;</td><td class=\"rt\">$cap</td></tr>";
echo "<tr><td class=\"lt\">お名前</td><td class=\"rt\">$name</td></tr>";
echo "<input type=\"hidden\" name=\"name\" value=\"$name\">";
echo "<tr><td class=\"lt\">電話番号</td><td class=\"rt\">$phone</td></tr>";
echo "<input type=\"hidden\" name=\"phone\" value=\"$phone\">";
echo "<tr><td class=\"lt\">メール</td><td class=\"rt\">$email</td></tr>";
echo "<input type=\"hidden\" name=\"email\" value=\"$email\">";
echo "<tr><td class=\"lt\">コメント</td><td class=\"rt\">$comment</td></tr>";
echo "<input type=\"hidden\" name=\"comment\" value=\"$comment\">";
echo "<tr><td class=\"lt\">&nbsp;</td><td class=\"rt\"><p class=\"rc\">$conf</p></td></tr>";
echo "<tr><td class=\"lt\">&nbsp;</td><td class=\"rt\"><p>$btn1</p><p>$btn2</p></td></tr>";
echo "</table>";
echo "</form>\n";
}elseif($action == "send"){
/*送信内容*/
mb_language("Japanese");
mb_internal_encoding("utf-8");
$agent = getenv("HTTP_USER_AGENT");
$host = getenv("REMOTE_HOST");
$addr = getenv("REMOTE_ADDR");
if($host == "" || $host == $addr){$host = @gethostbyaddr($addr);}
$date = gmdate("Y/m/d H:i:s (D)",time()+9*60*60);
$from = $email;
$header  = "From: $from";
$msg = "【お名前】\n$name\n\n";
$msg .= "【電話番号】\n$phone\n\n";
$msg .= "【メール】\n$email\n\n";
$comment = str_replace("<br>", "\n", $comment);
$msg .= "【コメント】\n$comment\n\n";
$msg .= "【投稿時間】$date\n";
$msg .= "【IPアドレス】$addr\n";
$msg .= "【ホスト名】$host\n";
$msg .= "【ブラウザ・OS】$agent\n\n";
if(mb_send_mail($to, $subject, $msg, $header)){
/*送信成功*/
echo "<p class=\"rmb\">メールは正常に送信されました</p>";
echo "<p><input type=\"button\" id=\"back\" value=\"戻る\" onclick=\"history.go(-2)\"></p>";
}else{
/*送信失敗*/
echo "<p class=\"rmr\">メールの送信に失敗しました。もう一度やり直して下さい</p>";
echo "<p><input type=\"button\" id=\"back\" value=\"戻る\" onclick=\"history.go(-2)\"></p>";
}
}
?>
<!--mailform--></div>

関連リンク

 メールアドレス再入力付メールフォーム

 メールフォーム

  • カテゴリー:Labs
  • facebook6
  • はてなブックマーク3
  • Google+3
  • Pocket0
  • Twitter0