とあるweb屋の仕事術

とあるweb屋の仕事術

10年以上現役のweb製作屋さん。web製作雑務全部やる。

フォームのmethod属性、GETとPOSTの違い

フォームのmethod属性、GETとPOSTの違い

フォームの実装で form タグを使用しますが、

その際に method という属性があります。

<FORM>-HTMLタグリファレンス

 

<form action="/inquiry/" name="hoge" method="post">
<input type="text" name="example">
<input type="submit" value="送信">
</form>

 

とか

  

<form action="/inquiry/" name="hoge" method="get">
<input type="text" name="example">
<input type="submit" value="送信">
</form>

 

とかですね。

 <form>-HTML5タグリファレンス

method属性は、データの送信方法(HTTPメソッド)を指定する際に指定します。 method属性の値として指定できるのは以下の2種類です。

  • get …… 送信内容がURLとして渡される(初期値)
  • post …… 本文(本体)として送信される
 

ユーザから目に見える具体的な違い

 

GETの場合、

遷移先のURLにname属性のパラメータが付く形になります。

 

<form action="/inquiry/" name="hoge" method="post">

 

このように送信先(action属性)が「/inquiry/」で、

name属性 が「hoge」の場合、input submit で

遷移した先のURL(アドレスバー)では

「www.toraru.jp/inquiry/?name=hoge」という

アドレスになります。

 

 POSTはURLに変化がないため、遷移先でも

「www.toraru.jp/inquiry/」というURLになります。

 

技術的な違いについては下記サイトで

詳しく解説されています。

qiita.com

 

ざっくりまとめると、以下の違いで用途が分かれるようです。

 

  • GETは冪等かつ安全です。
    GETはなにかを取得するときに使うべきものです。
  • URLをブックマークできるので、name=hogeで検索したときの検索結果をブックマークできます
  • POSTは冪等でないかつ安全でないです。
    POSTはなにかを新しく登録するときに使うものです。
  • name=hogeで検索したときの検索結果をブックマークすることができません

 

覚えたての頃は、

どっちどっちだっけと忘れがちだったので、

GETの場合はURLが ゲット(URLがブックマーク)できる、

という覚え方してました。