質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

87.80%

【HTTPヘッダーとは?】

受付中

回答 2

投稿 編集

  • 評価
  • クリップ 0
  • VIEW 1,469

score 11

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


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

【HTTPリクエスト部分】→「ID・パス」を入力し、Amazonにログインさせて下さい。

【HTTPレスポンス部分】→成功:Amazonの画面(ページ)が見れる。
失敗:ログインエラーが表示される。

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

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

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

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


【コード・JavaScript】

/* ユーザー認証情報を取得すると想定 */

// ①コンストラクター
var xml = new XMLHttpRequest();

// ②POST(送信)
xml.open( 'POST', 'ログイン後のURL(TOPページURL)', false );

// ③リクエストヘッダーに設定
xml.setRequestHeader( 'Content-Type', 'application/x-www-form-urlencoded' );

// ④送信(※ここが良く分からない。)
xml.send( 'ログイン情報を渡す?(例:ID="hogehoge@hoge.com" , pass="Hoge@1234")' );

//------------------------------------------------------------------------------------------------------------------------------//
// ①で、POSTする値を設定する為に、変数を作成するイメージ。
// ②、③で送信する為の値を設定をしている。
// ④で設定した情報を送信する・・・。
// 
// のかな~?の認識です。
// 
// ※④のカッコの中身が書き方不明です。  何の値を設定するの? ID? パスワード??
// ※もし、「ID と パスワード」なら、固定値だと1人しか情報取得出来ず、変数など可変の値にしたいが、可能か?
// 
// もしここまでの認識で合っているならば、④で送信したからには「レスポンスは」絶対返ってくる(成功 or エラー)と思ってます。
// そのレスポンスはどうやって受け取るのか、分かりません。  勝手にアラートで表示される?
//------------------------------------------------------------------------------------------------------------------------------//

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

  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 過去に投稿した質問と同じ内容の質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

質問への追記・修正、ベストアンサー選択の依頼

  • think49

    2019/08/22 18:59

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

    キャンセル

  • mie.8

    2019/08/22 23:37 編集

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

    キャンセル

回答 2

+4

セッションと認証情報

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

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

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

目的と打開策

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

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

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

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

検証環境の構築

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

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

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

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

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

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

Re: mie.8 さん

投稿

編集

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2019/08/23 22:58

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

    キャンセル

  • 2019/08/24 13:49

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

    キャンセル

  • 2019/08/25 13:41

    ありがとうございます。

    キャンセル

+2

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

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2019/08/22 11:06

    分かりづらく、申し訳ございません。
    仮に「Amazon」にIDとパスワードを入力し、ログインするとします。

    【HTTPリクエスト部分】→「ID・パス」を入力し、Amazonにログインさせて下さい。

    【HTTPレスポンス部分】→成功:Amazonの画面(ページ)が見れる。
                 失敗:ログインエラーが表示される。

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

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

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

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

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

    キャンセル

15分調べてもわからないことは、teratailで質問しよう!

  • ただいまの回答率 87.80%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる

関連した質問

同じタグがついた質問を見る