そんなにGeekじゃないエンジニアブログ

[WordPress]POSTメッセージの送信、受信。ユーザーからのデータを受け取って動的なサイト作り

calendar

こんにちは。でんすけ(@notgeek_densuke)です。

今回は、WordPressブログでPOSTメッセージの送受信をやってみます。

あるページからPOSTメッセージを送って、
別のページでメッセージを受け取って表示、という形を想定します。

スポンサーリンク

POSTメッセージを送る

まずはPOSTメッセージを送る側のページを作ります。

具体的には、HTMLの<form>を使うだけ。

<form method="post" action="https://wordpressのページURL">
	<div>
		お名前:<input type="text" name="yourname" maxlength="30" required>
	</div>
	<div>
		性別:
		<input type="radio" name="sex" id="input_man" value="man" checked>
			<label for="input_man">男性</label>
		<input type="radio" name="sex" id="input_woman" value="woman">
			<label for="input_woman">女性</label>
	</div>
	<div>
		年齢:<input type="number" name="age" required>
	</div>
	<div>
		好きな食べ物:
		<input type="checkbox" name="food[]" id="input_udon" value="うどん">
			<label for="input_udon">うどん</label>
		<input type="checkbox" name="food[]" id="input_soba" value="そば">
			<label for="input_soba">そば</label>
		<input type="checkbox" name="food[]" id="input_ramen" value="ラーメン">
			<label for="input_ramen">ラーメン</label>
	</div>
	<input type="submit" value="送信">
</form>

ここで注意点。
WordPressでは、name属性に「name」を使ってはいけません

例えばこんな感じ。

<!-- WordPressではnameにnameを入れちゃダメ -->
お名前:<input type="text" name="name">

こうすると、POST先のページを表示する際に404などのエラーになってしまうので要注意です。

WordPressの仕様上、ダメみたいです。
WordPressじゃなければ使っても大丈夫ですが。

POSTメッセージを受信する

次は受信する側。
さきほどの「action」のところに入力したURLで指定されるページを作成します。

FTPソフトなどでphpファイルを自前で配置してもいいですが、
functions.phpでショートコードなどを作って、投稿ページや固定ページに埋めておくのが手っ取り早いかと思います。

受信側の処理は、例えばこんな感じ。

if($_SERVER["REQUEST_METHOD"] == "POST"){
	$result .= htmlentities( $_POST["yourname"], ENT_QUOTES, 'UTF-8' ) . "さん";
	$result .= "(" . $_POST["age"] . ")";
	$result .= ($_POST["sex"]=="man" ? "男性" : "女性") . "のラッキーフードは";
	if( isset($_POST["food"]) && is_array($_POST["food"]) ){
		foreach($_POST["food"] as $value){
			$result .= "、" . $value;
		}
	}
	else{
		$result .= "、麺類以外";
	}
	$result .= "です!";
	return $result;
}

実行結果は、こんな感じ↓になります。

お名前:
性別:
年齢:
好きな食べ物:

PHPで受け取るPOSTメッセージは$_POSTにあり

POSTメッセージを受信したら、PHPの変数「$_POST」というものにデータが格納されます。
form部品それぞれに割り当てられたデータが、$_POSTに連想配列の形で格納されます。

・$_POST[“yourname”] → yournameに入力された文字列
・$_POST[“sex”] → ラジオボタンsexで設定されたvalue値
・$_POST[“age”] → ageに入力された文字列

という紐づきですね。

チェックボックスから複数のデータをPHPで取得

$_POST[“food”]に関しては、複数のデータが格納される可能性があります。

html側を見ると、

<input type="checkbox" name="food[]" id="input_udon" value="うどん">

name属性が「food[]」となっており、[]が付いています。

この[]を付けておくことで、foodを配列形式で送ってね、という意味になります。
なので、こんな感じでforeachで書ける、ということですね。

foreach($_POST["food"] as $value){
	$result .= "、" . $value;
}

もし配列じゃない形で取得したければ、
html側をこんな感じにする必要があります。

<input type="checkbox" name="udon" id="input_udon" value="うどん">
	<label for="input_udon">うどん</label>
<input type="checkbox" name="soba" id="input_soba" value="そば">
	<label for="input_soba">そば</label>
<input type="checkbox" name="ramen" id="input_ramen" value="ラーメン">
	<label for="input_ramen">ラーメン</label>

nameをそれぞれ別の名前にしておきます。
こうしておくと、POSTメッセージを受信したPHP側で

if( isset($_POST["udon"] ){
	$result .= $_POST["udon"];
} 

と個別に対処することができます。

POSTデータをエスケープ

先ほどのソース、名前のデータに
htmlentities()
という関数を使っていました。

こんなやつ。

$result .= htmlentities( $_POST["yourname"], ENT_QUOTES, 'UTF-8' ) . "さん";

これ、PHPの標準関数で、HTMLに関する特殊文字
(例えば<、>など)
HTMLエンティティに変換してくれる関数です。

名前の欄にHTMLタグを記入されてしまうパターンもあり得ます。
それをそのままWebサイトに表示するプログラムなので、
htmlentities()でエスケープしておくと少し安心です。

まとめ

ということで、WordPressでPOSTメッセージの送受信、でした。

formでデータをPOSTして、
指定したページで$_POSTで値を取得します。

不要なタグ等が心配であれば、htmlentities()でエスケープしておきましょう。

というあたりを踏まえれば、POSTを使ってユーザーに色々入力してもらうブログも作れますね。
レスポンシブなサイトを目指したい方は挑戦してみてください。

それではまたー。

この記事をシェアする

コメント

コメントはありません。

down コメントを残す




CAPTCHA


このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください