はじめに
画面遷移をする際にデータを持ち回る手段にはいくつか手段がありますが、
一度それらを纏めてみたくなったのでメモしてみます。
編集リクエスト大歓迎です！
GET
// 一つのパラメータを送信する
https://hogehoge.test?sample1=123
// 複数のパラメータを送信する
https://hogehoge.test?sample1=123&sample2=456
// 配列のパラメータを送信する
https://hogehoge.test?array[]=123&array[]=456
// 連想配列のパラメータを送信する
https://hogehoge.test?array[key][]=123&array[key][]=456
送信するデータがURLに表示されます。
POST
https://hogehoge.test
HttpRequestBody
sample1: 123
sample2: ["John", "Pete", "Bob"]
sample3: {key, "value"}
送信するデータがURLに表示されません。
HttpRequestのBodyに「key, value」の組み合わせで格納されます。
GETとPOSTの使い分け
GETは検索・ソート条件等見えても構わない、寧ろ何の条件を渡しているのか明示的にしたい場合に使用します。
ログイン機能や登録・更新機能には適しません。
POSTは第三者の見知らぬ他人が盗み見たら不味いようなデータ送信時に使用します。
パスワード入力欄では「●●●」とマスキングしていたのでURLに表示されてしまったら意味がないですね。。
ログイン機能や登録・更新機能に適します。
※POSTデータはhttps等で暗号化していないと、リクエスト/レスポンスのパケットの中身を解析すれば簡単に確認できてしまうので要注意です。
Session
サーバ側のSessionの領域にデータを保存しておき、CookieのSession IDと紐づくデータを参照することができます。
「key, value」の組み合わせで格納されます。
ログイン後取得したユーザ情報、検索結果リスト等ログアウトするまでの間に保持しておきたい情報を格納するのに適しています。
Sessionが切断されてしまうと、保持していたデータは参照不可→消失してしまうので、永続化したいデータはDBやファイルに格納する必要があります。
大抵のWeb系言語でサポートされていますが、
ピュアでSessionを取り扱うのはセキュリティ面で考慮すべき点が多数あり面倒です。
その点、フレームワークを採用しているならば、優れたSession用のライブラリが入っているのでそれらを採用すべきです。
ただし、
・Sessionのタイムアウト設定
・Session IDが記述されているCookieの名前変更
等追加で設定しておくべきポイントはあるので抑えておくべきです。
また、好き勝手にSessionにデータを保存しておくと、エコではないので使用しなくなったデータは直ぐに削除すべきです。
Cookie/localStorage/sessionStorage
ブラウザの標準機能で、
Sessionがデータをサーバに保存するのに対して、
Cookie/localStorage/sessionStorageはクライアント側にデータを保存します。
「key, value」の組み合わせで格納されます。
フロント側で画面の状態を保持したい場合等に適しています。
また、Cookie/localStorage/sessionStorageの違いは以下の通りです。
ストレージのサイズ
Cookie→4KB
localStorage→5MB
sessionStorage→5MB
有効期限
Cookie→設定による
localStorage→消さない限り永続的
sessionStorage→Windowかタブを閉じると消える
アクセス権限
Cookie→クライアントとサーバどちらからもアクセス可能
localStorage→クライアントからアクセス可能
sessionStorage→クライアントからアクセス可能
各種ブラウザの設定画面から値を確認できてしまいますので、クレジットカード情報等大事な情報はなるべく保存しないようにすべきです。
特にCookieはサーバからもアクセスできてしまいます！！
どうしても大事な情報を扱う必要がある場合は適時暗号化が不可欠となります。
参考サイト
最後に
保存しているデータの見える範囲とセキュリティを意識して使いまわしていきたいですね。