複数ページのルーティングとフォームのPOST送信 (3/4)
作成:2013-04-27 08:44
更新:2013-04-27 08:44
更新:2013-04-27 08:44
■フォームのPOST送信について
続いて、フォームをPOST送信した時の処理について考えてみましょう。既に、アドレスによってページ処理する方法はわかりましたから、フォームを持ったページを用意して、その送信先のアドレスの処理をする、という作業はわかっています。
最大の問題は、「GETか、POSTか」をどう見分けるかという点。そしてもう１点は「送信されたフォーム情報をどう取得するか」という点でしょう。
まずは、GETとPOSTの切り分けについてです。これは実は簡単に行えます。requestイベントハンドラで引数に渡されるrequestオブジェクトの「method」を調べるだけで済みます。ハンドラ内で、こんな具合に処理を用意すればよいでしょう。
下にサンプルリストを掲載しておきます。まずはこれらを作成しておいてください。
最大の問題は、「GETか、POSTか」をどう見分けるかという点。そしてもう１点は「送信されたフォーム情報をどう取得するか」という点でしょう。
まずは、GETとPOSTの切り分けについてです。これは実は簡単に行えます。requestイベントハンドラで引数に渡されるrequestオブジェクトの「method」を調べるだけで済みます。ハンドラ内で、こんな具合に処理を用意すればよいでしょう。
if (request.method == "GET"){
……GETの処理……
}
if (request.method == "POST"){
……POSTの処理……
}残る「POST送信されたフォームデータの取得」は、実際にコードを見たほうがわかりやすいでしょう。――では、これもサンプルを作って説明しましょう。まずは、表示コンテンツのテンプレートからです。今回は、content1.ejsにフォームを設置し、新たに用意するcontent3.ejsで送信されたフォームの表示を行わせることにしましょう。下にサンプルリストを掲載しておきます。まずはこれらを作成しておいてください。
(by. SYODA-Tuyano.)
※プログラムリストが表示されない場合
AddBlockなどの広告ブロックツールがONになっていると、プログラムリスト等が表示されない場合があります。これらのツールをOFFにしてみてください。
●プログラム・リスト●
※content1.ejs <h2>※サンプルで作ったコンテンツです。</h2> <p><%= message %></p> <hr> <form method="post" action="./post"> <table> <tr><td>ID:</td><td><input type="text" name="idname"></td></tr> <tr><td>PASS:</td><td><input type="password" name="pass"></td></tr> <tr><td></td><td><input type="submit"></td></tr> </table> </form> ※content3.ejs <p>※POSTでアクセスされたコンテンツです。</p> <p>ID: <%= idname %></p> <p>PASS: <%= pass %></p> <p><a href="/">戻る</a></p>
※関連コンテンツ