【HTTPヘッダーとは？】

HTTP リクエストに対して、「レスポンス」が来るのは分かったのですが、
その「リクエストデータ」と「レスポンスデータ」は、いつでも取得出来る物ですか？
データは、ブラウザ側かどこかに保持されている？
もしくは、リクエスト・レスポンス
する時だけの一時的な情報のやりとりなので、その時でないと取得出来ないでしょうか？

【やりたい事】
仮に「Amazon」にIDとパスワードを入力し、ログインするとします。

【HTTPリクエスト部分】→「ID・パス」を入力し、Amazonにログインさせて下さい。
↓
【HTTPレスポンス部分】→成功：Amazonの画面（ページ）が見れる。
失敗：ログインエラーが表示される。

のようなイメージを持っています。
リクエストを投げると、「成功」or「失敗」の何かしらのデータ？（情報？）が返って来る認識です。

そのやり取りの情報、
リクエスト時　→　ログインID・パス
レスポンス（成功）時　→　ユーザー情報（ログインID・パス）、最終ログイン日時、注文履歴・・・等
の情報のやり取りがあると思いますが、この情報は、ページにログイン後でもJavaScript等で取得出来るのかが知りたいです。

上記のやり取りは、あくまで「①ログイン時の一時的データ保持」なのか、「②ログイン後なので、リクエストデータは、セッションが切れるまでブラウザが保持」しているのかが知りたかったです。

もし、①ならば、もう１度「ajax」などでユーザー情報を「POST」すれば取得出来るのか？
②ならば、リクエスト情報はどこに保存されているのか？（IEのcookie？）
その取得方法は？
が知りたいです。

【コード・JavaScript】

JavaScript
1/* ユーザー認証情報を取得すると想定 */
2
3// ①コンストラクター
4var xml = new XMLHttpRequest();
5
6// ②POST（送信）
7xml.open( 'POST', 'ログイン後のURL（TOPページURL）', false );
8
9// ③リクエストヘッダーに設定
10xml.setRequestHeader( 'Content-Type', 'application/x-www-form-urlencoded' );
11
12// ④送信（※ここが良く分からない。）
13xml.send( 'ログイン情報を渡す？（例：ID="hogehoge@hoge.com" , pass="Hoge@1234"）' );
14
15//------------------------------------------------------------------------------------------------------------------------------//
16// ①で、POSTする値を設定する為に、変数を作成するイメージ。
17// ②、③で送信する為の値を設定をしている。
18// ④で設定した情報を送信する・・・。
19// 
20// のかな～？の認識です。
21// 
22// ※④のカッコの中身が書き方不明です。  何の値を設定するの？ ID？ パスワード？？
23// ※もし、「ID と パスワード」なら、固定値だと1人しか情報取得出来ず、変数など可変の値にしたいが、可能か？
24// 
25// もしここまでの認識で合っているならば、④で送信したからには「レスポンスは」絶対返ってくる（成功 or エラー）と思ってます。
26// そのレスポンスはどうやって受け取るのか、分かりません。  勝手にアラートで表示される？
27//------------------------------------------------------------------------------------------------------------------------------//

よろしくお願いいたします。

think49

2019/08/22 09:59

悪意を持ったスクリプトに読めますが、なぜid/passを盗み取りたいのでしょうか。

mie.8

2019/08/22 23:20 編集

IDとパスワードを盗み取りたいとは書いてません。（言ってません。）認証情報は、どうやって取得するかを聞いてます。

行動規範の内容に同意します

回答2件

セッションと認証情報

IDとパスワードを盗み取りたいとは書いてません。（言ってません。）
認証情報は、どうやって取得するかを聞いてます。

HTTPリクエストヘッダを読みとるという事は、ログイン時の認証情報(生データ)を参照する事なので、盗むことか可能です。
本来、セッションは認証情報をクライアント側に渡さない為の仕組みであり、「JavaScriptでHTTPヘッダを参照したい」がその用途に反する目的だったので、意図を尋ねました。

XMLHttpRequest, fetch 等によって、JavaScriptからリクエストを投げるならヘッダを取れますが、自身がリクエストしていない通信のHTTPヘッダを取る方法は私の知る限りではありません。
(取れたら、それこそ盗み放題ですし、安心して外部ドメインの外部jsを参照出来ません。)

目的と打開策

「HTTPヘッダを得て、何をしたいのか」を明らかにして下さい。
現状では、別の方法を模索することも出来ません。

ユーザーがログインする時に、「今月のお買い物金額情報」を付与され認証されるとします。
その情報をログイン後、ユーザーのTOPページに表示したく、認証情報の取得を行いたかったです。

認証を行うのは「サーバ」で、「今月のお買い物金額情報」を持っているのも「サーバ」です。
特定の通信リクエストを投げたら、「今月のお買い物金額情報」を返すコードをサーバサイドスクリプトで書いて下さい。
Web StorageやCookieにセッションIDを置く設計にすれば、認証は問題ないと思います。

セッションとブラウザの挙動を把握されていないようなので、セッションを使ったWebページを作って、ブラウザの動きを確かめてみる事をお勧めします。
ブラウザ付属のDevelopper Toolsの [Network] タブでHTTPヘッダを確認可能です。

検証環境の構築

参考に実装を試してみようと思いますが、実装するにあたって何か必要なツールを事前にインストールする必要はありますでしょうか？

PHPマニュアルを参照して下さい。

PHP: 必要なものは? - Manual

ここでは、貴重なネットワーク帯域を節約するために、ローカルに開発を行うことにしましょう。この場合、 » Apache のような Web サーバーと、当然、» PHP をインストールすることになります。また、多くの場合には、 » MySQL のようなデータベースもインストールすることになるでしょう。

「PHPマニュアル」は序章から順番に読んでいけば、インストールにも触れていますので、一通り読むことをお勧めします。

PHP: PHP マニュアル - Manual

Webサーバは最近では「nginx」も人気が高いようですが、私は詳しくないので、「Apache」「nginx」をWeb検索して情報量の多い方をインストールする事をお勧めします。

Chrome Developper Tools等の [Network] タブでは情報量が不足している場合は、Fiddlerをインストールしてみて下さい。

Fiddler - Free Web Debugging Proxy - Telerik

Re: mie.8 さん

投稿2019/08/23 03:48

編集2019/08/24 04:48

think49

総合スコア18189

mie.8

2019/08/23 04:09 編集

ご丁寧にありがとうございます。そして、申し訳ございませんでした。例）ユーザーがログインする時に、「今月のお買い物金額情報」を付与され認証されるとします。　　その情報をログイン後、ユーザーのTOPページに表示したく、認証情報の取得を行いたかったです。　　『XMLHttpRequest』をする場合、ログイン時のレスポンス情報の中から、「金額情報」が欲しいので、ユーザー情報を、もう1度「POST」する方法になりますでしょうか？また、SAML認証なので「SSO」が可能ですが、 SSO可能 = ログイン後のページ？　ブラウザ？に承認情報を持っている？と思い、ご質問しました。よろしくお願いいたします。

think49

2019/08/23 12:34 編集

親記事に追記しました。

mie.8

2019/08/23 13:58

リンク、ありがとうございます。参考に実装を試してみようと思いますが、実装するにあたって何か必要なツールを事前にインストールする必要はありますでしょうか？

think49

2019/08/24 04:49

親記事に追記しました。環境構築は当初の質問からずれていると思いますので、インストール時に問題があれば、別途質問を立てる事をお勧めします。

mie.8

2019/08/25 04:41

ありがとうございます。

行動規範の内容に同意します

ちょっと何を言っているのかわかりませんが、ブラウザの開発ツールで見ることができるので確認してみると良いです。

投稿2019/08/21 23:50

退会済みユーザー

総合スコア0

mie.8

2019/08/22 02:06

分かりづらく、申し訳ございません。仮に「Amazon」にIDとパスワードを入力し、ログインするとします。【HTTPリクエスト部分】→「ID・パス」を入力し、Amazonにログインさせて下さい。 ↓ 【HTTPレスポンス部分】→成功：Amazonの画面（ページ）が見れる。　　　　　　　　　　　　失敗：ログインエラーが表示される。のようなイメージを持っています。リクエストを投げると、「成功」or「失敗」の何かしらのデータ？（情報？）が返って来る認識です。そのやり取りの情報、リクエスト時　→　ログインID・パスレスポンス（成功）時　→　ユーザー情報（ログインID・パス）、最終ログイン日時、注文履歴・・・等の情報のやり取りがあると思いますが、この情報は、ページにログイン後でもJavaScript等で取得出来るのかが知りたいです。上記のやり取りは、あくまで「①ログイン時の一時的データ保持」なのか、「②ログイン後なので、リクエストデータは、セッションが切れるまでブラウザが保持」しているのかが知りたかったです。もし、①ならば、もう１度「ajax」などでユーザー情報を「POST」すれば取得出来るのか？ ②ならば、リクエスト情報はどこに保存されているのか？（IEのcookie？）その取得方法は？が知りたいです。よろしくお願いいたします。

行動規範の内容に同意します

あなたの回答