TechAcademy（テックアカデミー） プログラミング PHP PHPでフォームからデータを受け取る方法（GETとPOST）
PHP

PHPでフォームからデータを受け取る方法（GETとPOST）

プログラミング初心者向けに、PHPで【フォームからデータを受け取る】方法を初心者向けに解説した記事です。フォームからのデータの受け取り方法には、「GET」と「POST」の2通りがあるのでそれぞれ紹介します。

TechAcademyマガジンは受講者数No.1のオンラインプログラミングスクールTechAcademy [テックアカデミー]が運営。初心者向けに解説した記事を公開中。現役エンジニアの方はこちらをご覧ください。

プログラミング初心者向けに、PHPの基礎を紹介する記事です。

今回は、フォームからデータを受け取る方法について解説します。

最初にフォームの送信方法とPHPでの受け取り方に関しての説明をします。

その後、実際に動くコードを作成してデータの送受信を試していきます。

フォームでのデータのやりとりはWebサイトなどでは基本なので、ぜひ覚えておきましょう。

 

目次

開発環境はXAMPPを使っています。

 

GETとPOSTとは

PHPにおけるデータの受け取り方には、GETリクエスト と POSTリクエスト を使う2通りの方法があります。

POSTリクエストはフォームからHTTP通信により送信され、送信データはリクエストの本体に含まれます。

GETリクエストはフォームやリンクからHTTP通信により同じように送信されますが、送信データはURLの最後に？に続いて　パラメータ名=値という形式で付加されます。

 

 

大石ゆかり

フォームを使ってデータを送信できるんですね。

田島悠介

そうなんだ。フォームから送ったデータを、PHPで取得できるんだよ。

大石ゆかり

いろいろなところで使われてそうですね。

田島悠介

そうだね。後、フォームじゃないんだけどURLの最後に?p=2とか/p2/もGETでデータを送ってることになるんだ。

多くは何ページ目とかに使われるね。HTMLでフォームを作って送信してみよう！

[PR] PHPプログラミングで挫折しない学習方法を動画で公開中

HTMLのフォーム

サーバにデータを送信するためには、HTMLのフォームを使います。

GETリクエストのフォーム

フォームの構造は次のようなコードです。

<form action = “index.php” method = “GET”>
<input type = “text” name =“comment/“><br/>
<input type = “submit” value =“送信/“>
</form>

formタグのaction属性に送信先のURLを指定します。

送信方法はデフォルトでGETリクエストですが、method属性で POSTかGETに指定できます。

formタグ内の inputタグの値が送信するデータです。

この時、name属性がリクエストパラメータ名になり、value属性の値やテキストボックスに入力された値がそのパラメータの値です。

上のコードでは、フォームのデータは、commentというパラメータ名で入力値とのペアで送られ、送信方法はGETリクエストになり、送り先は index.php です。

POSTリクエストのフォーム

POSTリクエストにしたい場合は、次のようにform要素のmethod属性をPOSTに変更するだけです。

<form action = “index.php” method = “POST”>
<input type = “text” name =“comment/“><br/>
<input type = “submit” value =“送信/“>
</form>

送信されるデータ

ここでは、例としてcommentという名前属性のinput要素に hogehogeという文字を入力して送信するとしましょう。

GETリクエストのデータ

データがURLの一部として含まれてサーバに送られます。

送信先は index.phpとすると、URL全体は次のようになります。

http://index.php?comment=hogehoge

ここで注目していただきたいのは、後に付けた?comment=hogehogeの部分です。

GETリクエストのデータは基本的には、 ? の後に パラメータ名=値のペアの形式で送られます。

複数のデータの場合は、間を & でつなげます。

http://index.php?comment=hogehoge&title=hello

このURLで送られるのは、

comment=hogehogeとtitle=helloという２つのデータ（パラメータ名=値のペア）です。

 

 

フォームデータの受け取り方

GETリクエストで送信したデータを受け取る

GETリクエストで送信したデータは、グローバル変数である $_GET に連想配列という形で入っています。

そこで、PHPでデータを受け取るときは、この　$_GET を使います。

先ほどの例では、comment=hogehogeというデータが送られましたが、$_GETには、[‘comment’ => ‘hogehoge’] という連想配列で保存されます。

$_GETからデータを受け取るには、受け取りたいinput要素の name属性 をキーとして指定します。

例ではname属性が commentですから、　$_GET[‘comment’] という書き方です。

POSTで送信したデータを受け取る

同様に、POSTリクエストで送信したデータは、グローバル変数である $_POSTに連想配列という形で入っています。

PHPでデータを受け取るときは、$_GETで説明したように、　$_POST を使って、$_POST[‘comment’]と記述すれば値が取得できます。

 

受信データのバリデーション

フォームから送られてきた外部のデータは、開発者が想定していないようなデータである可能性があります。

場合によっては、悪意あるユーザーによって、危険なコードが含まれたデータが送られてくるかもしれません。

そのため、フォームデータを処理するには、まずそのデータが想定した値かどうか検証する（バリデーション）必要があります。

ここでは、データがPOSTリクエストによって送られてきたとします。

 

値が送信データに含まれているかをチェック

まず、送信データに入力データが入っているか確かめる必要があります。

そのためには、isset()や array_key_exists()メソッドを使います。

if ( !array_key_exists(‘comment’, $_POST){

  print “コメントは必須項目です。”;

}

こうすれば、必須項目で値が入っていない時はエラーを出力できます。

 

送信データが既定の文字数以下かをチェック

str_len()メソッドを使えば、値の文字数を取得できるので、それと比較したい文字数を以下のように比較します。

if ( str_len($_POST[‘comment’]) > 255 ) {

  print “コメントは２５５文字以下で入力してください。”;

}

 

他にもいろいろなバリデーションがあります。

 

Eメールの書式になっているかのチェックもできます。

詳しくはTechacademyのこの記事をご覧ください。

 

実際にコードを書いてみよう

以上の内容をおさらいするために、ここからは実際にコードを書いてフォームデータの送受信を試してみましょう。

HTMLでフォームを作る

PHPで実際にデータのやりとりをする前に、まずはHTMLを使ってフォームを作ります。

formタグのmethod 属性には、先ほどの GETリクエスト を指定しましょう。

これで、フォームからGETリクエストでデータを送信するということです。

<!DOCTYPE html>
<html lang = “ja”>
<head>
<meta charset = “UFT-8”>
<title>フォームからデータを受け取る</title>
</head>
<body>
<h1>フォームデータの送信</h1>
<form action = “index.php” method = “GET”>
<input type = “text” name =“comment/“><br/>
<input type = “submit” value =“送信/“>
</form>
</body>
</html>

 

ブラウザで表示すると次のようになります。

フォームデータの送信

これでフォームができました。

 

 

データを送信する（GET）

一度、データを送信してみましょう。

hogehoge と入力して送信ボタンを押してください。

hogehoge

 

すると、次のようにURLが変わります。

URL変化

注：フォームから送信を完了すると、多くのサイトでは「送信されました」といった別の完了ページに遷移します。しかしここでは、分かりやすくするために、同じファイルに送信します。

URLの？以下に、データが付加されていることをご確認ください。

form の name属性が comment なので、付加されるデータも comment=hogehoge になっています。

ここまでで送信フォームは完成しました。

続いて、受け取る側である、サーバ側のPHPプログラムの作成に移ります。

 

データを受け取る（GET）

ここで、まず送信したデータをきちんと受け取れるかを確認するために、受信側でデータを出力してみましょう。

<?php
$comment = $_GET[‘comment’];
echo $comment;
?>
<!DOCTYPE html>
<html lang = “ja”>
<head>
<meta charset = “UFT-8”>
<title>フォームからデータを受け取る</title>
</head>
<body>
<h1>フォームデータの送信</h1>
<form action = “index.php” method = “GET”>
<input type = “text” name =“comment/“><br/>
<input type = “submit” value =“送信/“>
</form>
</body>
</html>

 

先ほどと同じように、hogehoge と入力して送信を押します。

hogehoge

 

すると、ブラウザ上に「hogehoge」と表示されました。

hogehoge表示

これで、GETを使いデータを受け取る確認ができました。

 

ただ、このままでは、何も入力しないまま送信ボタンを押した場合、毎回エラーに飛んでしまいます。

エラーを出さずにデータを受け取ることができたときのみ処理されるように、バリデーションを追加したいと思います。

エラー

 

バリデーションを追加

PHPのif文（条件分岐） でバリデーションを追加したいと思います。

if文のなかに、「指定のデータを受け取ったときのみ」という条件式を書きます。

 

条件式には、先ほどご紹介した isset() というPHPの関数を使います。

isset は、(  )の中身に、指定のデータがセットされていれば真を返し、データがなければ偽を返すという関数です。

<?php
if(isset($_GET[‘comment’])){
$comment = $_GET[‘comment’];
echo $comment;
}
?>
<!DOCTYPE html>
<html lang = “ja”>
<head>
<meta charset = “UFT-8”>
<title>フォームからデータを受け取る</title>
</head>
<body>
<h1>フォームデータの送信</h1>
<form action = “index.php” method = “GET”>
<input type = “text” name =“comment/“><br/>
<input type = “submit” value =“送信/“>
</form>
</body>
</html>

 

if(isset($_GET[‘comment’])

最初のコードによって、$_GETグローバル変数に commentのパラメータが含まれているかチェックをしています。

あればその後の処理を実行します。

これで、データを入力せずに送信を押しても、エラーは発生しなくなりました。

フォームデータの送信

 

もちろん、データを入力して送信すれば、バリデーションチェックを通るので、入力値が画面に表示されます。

hogehoge

 

 

これで、バリデーションの追加ができました。

ここまでは、GETリクエスト でフォームデータの送受信をしていましたが、次からは、POSTリクエストを使って送受信をしてみましょう。

 

 

フォームデータの送受信（POST）

POST で送りたい場合は、

  • $_GETから$_POSTに変更
  • formタグのmethod属性を GET から POST に変更

すればOKです。

<?php
if(isset($_POST[‘comment’])){
$comment = $_POST[‘comment’];
echo $comment;
}
?>
<!DOCTYPE html>
<html lang = “ja”>
<head>
<meta charset = “UFT-8”>
<title>フォームからデータを受け取る</title>
</head>
<body>
<h1>フォームデータの送信</h1>
<form action = “index.php” method = “POST”>
<input type = “text” name =“comment/“><br/>
<input type = “submit” value =“送信/“>
</form>
</body>
</html>

 

ブラウザ上で確認しましょう。

POSTリクエストのため、データはリクエスト本体に入って送られるので、URLには何も表示されませんが、送信先の画面にデータがしっかり表示されているのがわかると思います。

POSTブラウザ

 

 

GET と POST の使い分け

GET では送りたいデータを直接URLに付加するので、URLを見ればサーバにどういうリクエストを送ったのかが明らかです。

検索フォームなどでGETリクエストが使われることが多いですが、検索内容をURLとして保存して後で利用したり、誰かとシェアしたりしたい場合は、GET が適しているでしょう。

GETリクエストはGoogleの検索エンジンなどにも使われています。

Googleの検索エンジンでは、検索窓にワードを入力して検索した時のURLには、q = ○○ という形で書き込んだキーワードが表示されます。

これは、q というのが検索窓の name属性で、画面の検索内容はhogehogeであることを示しています。

 

一方で、URLには長さの制限がありますので、大きなデータを送信するには向いていません。

また、パスワードのような秘匿したいデータの場合では、URLに直接表示されるGETリクエストは使えません。

そのような場合は、POSTリクエストを使うべきです。

用途によってGETリクエストとPOSTリクエストを使い分けると良いでしょう。

今回の記事は以上です。

 

執筆してくれたメンター

メンター安野

Webアプリケーションエンジニアとして長年健診業界で業務システムの開発に従事してきました。
TechAcademyではPHP/Laravelコースを担当しています。
開発実績: 健康診断システム、電話予約システム、検査管理システム、各種データ処理ツール

 

大石ゆかり

GETやPOSTで送信できました！ただ、どちらが良いのか迷ってしまいますね。

田島悠介

GETはURLに付くべき処理に向いているかな。何ページ目とか、カテゴリーやタグは何なのかって指定は、URLを通してGETで受け取って、データベースに問い合わせみたいな感じかな。

大石ゆかり

POSTは、本文が長い場合に多い感じですかね。掲示板とかショッピングサイト入力欄とかPOSTになってますよね。今思い返したんですが。

田島悠介

そうだね。SSL通信だとPOSTの内容も暗号化されるので、セキュリティに関わる物などもPOSTがいいね。

 

PHPを学習中の方へ

これで解説は終了です、お疲れさまでした。

  • つまずかず「効率的に」学びたい
  • 副業や転職後の「現場で使える」知識やスキルを身につけたい

プログラミングを学習していて、このように思ったことはありませんか？

テックアカデミーのPHP/Laravelコースでは、第一線で活躍する「プロのエンジニア」が教えているので、効率的に実践的なスキルを完全オンラインでしっかり習得できます。

合格率10%の選考を通過した、選ばれたエンジニアの手厚いサポートを受けながら、PHP/Laravelを使ったWebアプリケーション開発を学べます。

まずは一度、無料体験で学習の悩みや今後のキャリアについて話してみて、「現役エンジニアから教わること」を実感してみてください。

時間がない方、深く知ってから体験してみたい方は、今スグ見られる説明動画から先に視聴することをおすすめします！

記事を検索

関連するキーワード

関連する記事

PHPで配列の空要素を削除する方法を現役エンジニアが解説【初心者向け】

今回は、PHPで配列の空要素を削除する方法について、TechAcademyのメンター（現役エンジニア）が実際のコードを使用して初心者向けに解説します。 &...
PHP

PHPでarray_searchを使う方法を現役エンジニアが解説【初心者向け】

PHPでarray_searchを使う方法について、TechAcademyのメンター（現役エンジニア）が実際のコードを使用して初心者向けに解説します。 ...
PHP

PHPでクッキーを削除する方法を現役エンジニアが解説【初心者向け】

今回は、PHPでクッキーを削除する方法について、TechAcademyのメンター（現役エンジニア）が実際のコードを使用して初心者向けに解説します。 &nb...
PHP

PHPでSHA256を使う方法【初心者向け】

PHPでSHA256を使う方法について解説します。 ハッシュを生成する書き方について説明しているので、ぜひ理解しておきましょう。   ...
PHP

導入手順を解説！Laravelのインストール方法【初心者向け】

Laravelのインストール方法について、テックアカデミーのメンター（現役エンジニア）が実際のコードを使用して初心者向けに解説します。 そもそもP...
PHP

DBを作成する！PHPでSQLite3を扱う方法【初心者向け】

PHPでSQLite3を使う方法について解説します。   そもそもPHPについてよく分からないという方は、PHPとは何なのか解説した記事を...
PHP

あわせてよく読まれている記事

HTMLのフォームからPOSTで送信されたデータの受け取り方を現役エンジニアが解説【初心者向け】

HTMLのフォームからPOSTで送信されたデータの受け取り方について、TechAcademyのメンター（現役エンジニア）が実際のコードを使用して初心者向けに解説します。   そもそも、HTMLの記述方法がわからない場合は、 HTMLの書き方について解説した記事を読むとさらに理解が深まるでしょう。   なお本記事は、TechAcademyのオンラインブートキャンプWebデザイン講座のHTMLカリキュラムをもとに執筆しています。   田島悠介 今回は、HTMLに関する内容だね！ 大石ゆかり どういう内容でしょうか？ 田島悠介 フォームからPOSTで送信されたデータの受け取り方について詳しく説明していくね！ 大石ゆかり お願いします！   目次 POSTとは HTMLの入力フォームを送信した後のデータについて POSTとGETの違い POSTで送信されたデータの受け取り方   POSTとは POSTとは、ブラウザからサーバーにデータを送信するための形式です。 HTML文書にformタグを使用してから、Webサーバーにデータを送信するための入力装置が設置できます。 この入力装置を用いてユーザーから入力されたデータを送信するための形式として、「POST」もしくは「GET」のどちらかの手段が使用されます。   [PR] PHPプログラミングで挫折しない学習方法を動画で公開中HTMLの入力フォームを送信した後のデータについて ブラウザから送信されたデータをWebサーバーが受信してから、おもにPHPプログラム言語による処理にて扱われています。   POSTとGETの違い ブラウザからWebサーバーにデータが送信される際に、「HTTPリクエスト」と呼ばれる通信の工程が必要です。 この工程の手段として「POST」もしくは「GET」は、データの形式に相違があります。   GET 「GET」は、ブラウザのURL表示欄にも識別子として表示される通り、ユーザーも識別子の規則性を知っていれば目視で確認することができます。 「GET」は、文字数の制限が多いため、断片的な情報を伝達する場合に適しているといえるでしょう。   POST 「POST」は、ブラウザのURL表示欄には表示されず、通信の内容として送信されることに加えて、文字数の制限が「GET」よりも少ないので機密性のある長文を送る場合は適しています。 なお、標準的に暗号化されているデータの形式にはならず、ユーザーからは目視での確認ができない仕組みです。 これについては、開発者向けのツールを使用できれば確認することができるでしょう。   POSTで送信されたデータの受け取り方 以下、POSTで送信するためのサンプルコードです。   HTML <form action="sample.php" method="post"> <input type="textarea" name="confirm" value=""> <input type="submit" value="送信"> </form> See the Pen 2020-05-18-sample01 by YOHEI INAI (@yohei_inai) on CodePen. PHP(sample.php) <?php echo $_POST["confirm"]; ?>   実行結果 入力装置に『SAMPLE』のテキストを入力し、送信します。 sample.phpにデータが送信されて、『SAMPLE』が出力されます。 上記は、ブラウザからサーバーにデータを送信するための技術の基礎です 応用として実用的にするためには、セキュリティ対策の処理も必要といえるでしょう。   執筆してくれたメンター 井内洋平 TechAcademyの現役メンター。 元Web Developerで、趣味は貯金、節税対策、投資信託、株式投資、FXなど多岐にわたる。   大石ゆかり HTMLのフォームからPOSTで送信されたデータの受け取り方がよく分かったので良かったです！ 田島悠介 ゆかりちゃん、分からないことがあったら質問してね！ 大石ゆかり 分かりました。ありがとうございます！   TechAcademyでは初心者でも、オリジナルWebサイトを公開できる、オンラインブートキャンプを開催しています。 また、現役エンジニアから学べる無料体験も実施しているので、ぜひ参加してみてください。
HTML

PHPでセレクトボックスから値を受け取る方法を現役エンジニアが解説【初心者向け】

今回は、PHPでセレクトボックスから値を受け取る方法について、TechAcademyのメンター（現役エンジニア）が実際のコードを使用して初心者向けに解説します。   PHPについてそもそもよく分からないという方は、PHPとは何なのか解説した記事を読むとさらに理解が深まります。   なお本記事は、TechAcademyのオンラインブートキャンプ、PHP/Laravel講座の内容をもとに紹介しています。   田島悠介 今回は、PHPに関する内容だね！ 大石ゆかり どういう内容でしょうか？ 田島悠介 PHPでセレクトボックスから値を受け取る方法について詳しく説明していくね！ 大石ゆかり お願いします！   この記事は、HTMLのセレクトボックスで選択された値をPHPプログラムで受け取る方法について記載した記事です。 HTML、PHPのことがまだあまりよく分かっていない方でも理解できる内容になっています。   目次 セレクトボックスとは セレクトボックスから値を受け取る方法 実際に書いてみよう まとめ   セレクトボックスとは セレクトボックスとはHTMLの<select>タグを使用して作成することのできる、選択肢が複数あるプルダウンメニューのことです。 PHPでは、画面のセレクトボックスで選択された値を受け取り、DBにデータを検索・登録・更新・削除などの処理を行うことができます。   [PR] PHPプログラミングで挫折しない学習方法を動画で公開中セレクトボックスから値を受け取る方法 セレクトボックスで選択された値をPHPなどのサーバーサイドプログラムで受け取るには、まずセレクトボックスを持つ画面側は、HTMLの<form>タグで<select>タグを囲まなければいけません。 <form>タグで囲まれたHTMLの部品は、入力・送信フォームとなり選択・入力された値をサーバーサイドプログラムに送ることが可能になります。 次にPHP側では、<form>タグに記載された、GET・POSTなどのリクエストメソッドに合わせてデータを受け取る「スーパーグローバル変数」が用意されています。 GETリクエストの場合は、スーパーグローバル変数「$_GET[]」を使用して画面のフォームから送信された値を受け取ります。POSTリクエストの場合は、スーパーグローバル変数「$_POST[]」を使用して画面のフォームから送信された値を受け取ります。 2つの変数の[]の部分には、画面側HTML内に記載されたname属性に設定された文字列を渡します。name属性に指定された文字列を指定することで、そこで入力された値を受け取れる仕組みになっています。 ちなみにスーパーグローバル変数とはPHPのプログラム内のどこからでも呼び出すことができる、PHPがあらかじめ用意している変数で、$_GET、＄_POSTの他にも様々なスーパーグローバル変数が用意されています。   実際に書いてみよう それでは、実際にセレクトボックスで選択された値を、PHPプログラムで受け取る例を見ていきましょう。 サンプルコード(index.php)： <?php if(isset($_POST["fruits"])) { // セレクトボックスで選択された値を受け取る $fruit = $_POST["fruits"]; // 受け取った値を画面に出力 echo $fruit; } ?> <!DOCTYPE html> <html> <head> <metacharset = "utf-8"> <title>セレクトボックスの値をPHPで受け取る</title> </head> <body> <h1>セレクトボックスの値を送信</h1> <form action="index.php" method = "POST"> <select name= "fruits"> <option value = "りんご">りんご</option> <option value = "れもん">れもん</option>
PHP

Laravelでリクエストを実行する方法【初心者向け】

Laravelでリクエストを実行する方法について解説します。 POST/GETで値を受け渡す流れを実際にプログラムを書いて理解しましょう。   そもそもPHPについてよく分からないという方は、PHPとは何なのか解説した記事を読むとさらに理解が深まります。   なお本記事は、TechAcademyのオンラインブートキャンプPHP/Laravel講座の内容をもとに紹介しています。   田島悠介 今回は、Laravelに関する内容だね！ 大石ゆかり どういう内容でしょうか？ 田島悠介 Laravelでrequestを使う方法について詳しく説明していくね！ 大石ゆかり お願いします！   requestとは クライアント（Webブラウザなど）とサーバー（Webサーバー）はHTTPプロトコルで通信します。 クライアントはサーバーにリクエスト（要求）を送り、サーバーはリクエストに応じたレスポンス（応答）を返します。 HTTPプロトコルには、リクエストを実行するための方法がいくつかあり、最も一般的なのはPOSTメソッドとGETメソッドです。 HTTPリクエストは2つの部分で構成されます。リクエストに関するデータを持つヘッダーと、サーバーに処理させるデータを持つ本文です。 以降は、サーバーに処理させるデータの受渡し方法について説明します。   LaravelでのPOST/GETでの値の受渡し方法 リクエストにはサーバーに処理させるデータを含めることができます。 データは名前と値のペアです。例えばユーザー名なら `username=John` のような形式のデータになります。 リクエストはHTMLのフォームから送信できます。 <form method="POST(またはGET)" … > … <input type="text" name="username" value="" … > … </form> inputなどの要素でname属性にデータの名前を指定します。ユーザーの入力値はvalue属性にセットされます。 このフォームが送信されるとき、リクエストに各データが含まれます。 POSTメソッドの場合、リクエストの本文が以下のようになります。 他のデータ&username=John&他のデータ   GETメソッドの場合、URLに含まれるクエリ文字列が以下のようになります。 http://localhost:8000/users?他のデータ&username=John&他のデータ また、GETメソッドのリクエストは、HTMLのリンクから送信するのが一般的です。 a要素のhref属性にURLを指定しますが、そのクエリ文字列にデータを含めておきます。 <a href="/users?他のデータ&username=John&他のデータ">…</a> コントローラのアクションでは、Laravelのリクエストインスタンスからデータを取得します。 リクエストインスタンスは、アクションの引数で受け取ったり、ヘルパ関数request( )の呼出しにより取得できます。   以下のような方法で、リクエストインスタンスからデータを取得できます。 $request->all(); // 全データを連想配列で取得 $request->only([ 'username', 'password']); // 一部のデータのみを連想配列で取得 $request->except(['credit_card']); // 一部のデータのみ（指定したデータ以外）を連想配列で取得 $request->input('username'); // 個別のデータをinputメソッドにより取得 $request->username; // 個別のデータを動的プロパティにより取得 request('username'); // 個別のデータをヘルパ関数request()により取得   [PR] PHPプログラミングで挫折しない学習方法を動画で公開中実際にLaravelでリクエストを受け取ってみよう 例として、GETメソッドのリクエストで複数のデータを受け取ってみましょう。 routes/web.phpファイルに以下のようなルートを追加します。 Route::get('/users', function () { $request = request(); // リクエストインスタンスを取得 $data
PHP

PHPでフォームの二重送信を防止する方法を現役エンジニアが解説【初心者向け】

PHPでフォームの二重送信を防止する方法について、TechAcademyのメンター（現役エンジニア）が実際のコードを使用して初心者向けに解説します。 そもそもPHPについてよく分からないという方は、PHPとは何なのか解説した記事を読むとさらに理解が深まります。   なお本記事は、TechAcademyのオンラインブートキャンプPHP/Laravel講座の内容をもとに紹介しています。   田島悠介 今回は、PHPに関する内容だね！ 大石ゆかり どういう内容でしょうか？ 田島悠介 PHPでフォームの二重送信を防止する方法について詳しく説明していくね！ 大石ゆかり お願いします！   この記事は、PHPプログラムでフォームの二重送信を防止する方法について解説した記事です。 PHPプログラム内で、Web技術の1つ「セッション」を使用する防止方法について解説します。「セッション」についてあまり理解てきていないという方は、「セッション」についての理解しておくと、この記事で解説している内容について理解しやすいと思います。   目次 二重送信の概要と原因 二重送信を防止する方法 実際に書いてみよう まとめ   二重送信の概要と原因 二重送信とは、例えば個人情報を登録するWebページで個人情報登録フォームを入力し終えた後に「登録」ボタンを押したとします。その後、内部的には、画面からサーバに対して登録をするための「リクエスト」が送信され、サーバ内のプログラムによって、DB(データベース)への登録処理や、登録するデータのファイル出力処理などが行われます。そのような処理が完了した後に画面に対して「レスポンス」が返されます。 そのレスポンスが返却される前に、「登録」ボタンを再度押してしまうと、本来1件しか登録してはいけない個人情報がDBに2件登録されてしまったり、ファイルに2件出力されてしまったりと、システムとしてあってはならないことが起きてしまいます。 これが二重送信と呼ばれる原因の1つの例で、このような二重送信を防止するために画面のプログラムや、サーバのプログラム内に防止対策を施さなければいけません。 この二重送信は、他にも「二重登録」、「二重更新」、「二重リクエスト」と呼ばれることがあります。これらは本質的に同じで、「二重で実行されるシステムとしては行ってはいけない処理」を防止するための処理を実装する必要があります。   [PR] PHPプログラミングで挫折しない学習方法を動画で公開中二重送信を防止する方法 画面側でJavaScriptによる防止対策を実装する方法もありますが、今回はPHPによるサーバサイドプログラム内で、「セッション」を利用して二重送信を防止する方法について解説していきます。 セッションによる二重送信を防止する手順： 登録(更新)画面でランダムな文字列の「トークン」を発行する 発行したトークンをセッション変数に格納する 画面の送信フォーム内「hidden要素」にPOSTするトークンをセットする 登録(更新)ボタンが押された場合、サーバプログラムで、セットした「セッション変数のトークン」と「POSTされた(hidden要素の)トークン」を比較する 比較して一致する場合、その後の処理（フォーム登録情報を登録など）を行う 上記手順の処理を行えば、二重送信が行われた際に、「セッション変数のトークン」と「POSTされたトークン」が異なるため、「二重で実行されるシステムとしては行ってはいけない処理」を防止できます。   実際に書いてみよう それでは、実際に上記に記載した二重送信防止の手順を実装したプログラムのサンプルを見て行きましょう。 index.php: <?php session_start(); // 二重送信防止用トークンの発行 $token = uniqid('', true);; //トークンをセッション変数にセット $_SESSION['token'] = $token; ?> <!DOCTYPE html> <html> <head> <meta charset = "utf-8"> <title>アカウント登録画面</title> </head> <body> <h1>アカウント登録画面</h1> <form action = "create_account.php" method="POST"> <div> <span>ID：</span> <input type="text" name="id"> </div> <br /><br /> <div> <span>PASSWORD：</span> <input type="text"name="password"> </div> <input type="hidden" name="token"
PHP

JavaScriptでPOST送信する方法を現役エンジニアが解説【初心者向け】

JavaScriptでPOST送信する方法について、TechAcademyのメンター（現役エンジニア）が実際のコードを使って初心者向けに解説します。   JavaScriptについてそもそもよく分からないという方は、JavaScriptとは何なのか解説した記事をまずご覧ください。   なお本記事は、TechAcademyのオンラインブートキャンプ、JavaScript/jQuery講座の内容をもとにしています。   田島悠介 今回は、JavaScriptに関する内容だね！ 大石ゆかり どういう内容でしょうか？ 田島悠介 JavaScriptでPOST送信する方法について詳しく説明していくね！ 大石ゆかり お願いします！   POSTとは POSTとは、通信規格であるhttp通信内でWebページの中でサーバ(Webサーバ)とクライアント(ブラウザ等)とのやりとりに利用する一つの機能です。 ブラウザの表示方法として、GETという機能を使ってブラウザが「このURLのページを送って！」とリクエストを出し、Webサーバが指定されたURLのページをクライアントに送信し、ブラウザ上で目的のページが表示されます。 GETは主にサーバへWebページなどのデータをリクエストする際に利用するものであり、POSTは逆にデータを送信する際に使います。 POSTは、Webの掲示板などで文章を投稿する際などに利用されています。   JavaScriptでPOST送信する方法 POST送信を行うにはHTMLのフォームを利用するなど様々な方法があるものの、JavaScriptでPOST送信したい場合もあります。 例えば、Webアプリケーションの中にはボタンを押した際に画面の遷移は行わないけど、画面の一部を書き換えたい場合などはJavaScriptを使ってPOST送信をすることが可能です。 今回は簡単な数値計算アプリケーションを使って、JavaScriptによるPOST送信の方法を見ていきましょう。 今回作成する数値計算アプリケーションでは、入力欄が3つあり、1つめと2つめに数値を入れましょう。 計算ボタンを押すと3つ目の入力欄に2つの値を足した計算結果が表示されます。 画面は以下のような形となります。 [PR] PHPプログラミングで挫折しない学習方法を動画で公開中実際に書いてみよう 今回作成した数値計算アプリケーションのソースコードはHTMLファイルとJavaScriptファイル、サーバ側のPHPファイルです。 ※サーバ側PHPファイル <?php $arg1 = $_POST['arg1']; $arg2 = $_POST['arg2']; $answer = $arg1 + $arg2; echo $answer; ※HTMLファイル <!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <title>計算機アプリ</title> <script src="script.js"></script> </head> <body> <input id="arg1" type="number"> + <input id="arg2" type="number"> = <input id="answer" type="number"> <br/> <button id="calc_button">計算</button> </body> </html> ※JavaScriptファイル window.onload = function() { // 計算ボタンを押した際の動作を設定 document.getElementById('calc_button').onclick = function() { post(); };
JavaScript

HTTPリクエストを簡単に！npm requestを使う方法【初心者向け】

今回は、npm requestについて解説します。 HTTPリクエストを簡単に行いたい場合に参考にしてみてください。実際にrequestをインストールして使う手順を書いているので、自身でも書きながら理解していきましょう。   なお本記事は、TechAcademyのNode.jsオンライン講座の内容をもとに作成しています。   npm requestとは npm requestとは、npmを利用して利用することができるHTTPリクエスト機能です。 HTTPリクエストとは、HTTPは Hypertext Transfer Protocol （ハイパーテキスト・トランスファー・プロトコル）を要求することです。 ハイパーテキストとは、HTMLファイルです。トランスファーは、受け渡しを意味し、プロトコルは決まり事で、規約とも呼ばれます。 つまり、HTTPリクエストとはHTMLファイルの受け渡し上の規約と言う事です。 npm requestを利用することでこのHTML受け渡しの機能を簡単に利用できます。 npmとは、Node.jsのパッケージマネージャです。   npm requestを使う方法 インストールコマンド npm install request 解説 npm install requestでnpmを利用したrequestモジュールのインストールが可能です。 npm installについての記事も合わせて参考にしてみて下さい。   [PR] PHPプログラミングで挫折しない学習方法を動画で公開中HTTPリクエスト方法 ソースコード var request = require('request'); request.get('http://techacademy.jp', function(err, res, body) { if (err) { console.log('Error: ' + err.message); return; } console.log(body); });   実行結果 テックアカデミーのソースコードが表示されます。   解説 1行目の、var request = require(‘request’);では、requireを利用してrequestモジュールを呼び出しています。 2行目の、request.get(‘http://techacademy.jp’, function(err, res, body) {では、http://techacademy.jpというURLをパラメーターとしてページ情報を取得しています。 3行目の、if (err) {では、2行目の処理がエラーだった場合の条件を指定しています。 4行目の、console.log(‘Error: ‘ + err.message);では、3行目の条件に当てはまる場合エラーメッセージを表示する処理をしています。 5行目の、return;では、4行目のエラー表示後処理を終了する処理をしています。 6行目の、}では、3行目の処理を終了しています。 7行目の、console.log(body);では、2行目の処理で無事データリクエストが完了しページデータを取得できた場合に、データを表示結果のように表示しています。 8行目の、});では、2行目の処理を終了しています。   今回は、npm requestについて解説しました。 HTTPリクエストを行う際にぜひ参考にしてみてください。   また、オンラインのプログラミングスクールTechAcademyでは、Node.jsオンライン講座を開催しています。 Node.jsを使ってWebアプリケーションを開発することができます。 現役エンジニアがパーソナルメンターとして受講生に1人ずつつき、マンツーマンのメンタリングで学習をサポートし、習得することが可能です。
Node.js

TechAcademyから
現役エンジニアの方へ
お知らせ

藤門千明
TechAcademy（テックアカデミー） プログラミング PHP PHPでフォームからデータを受け取る方法（GETとPOST）