web-dev-qa-db-ja.com

AJAX POST応答からCookieを（Set-Cookieから）取得して保存する

シンプルなjQuery AJAX POST=コード：

$.ajax({
    type: "POST",
    url: AppConstants.URLs.PROXY,
    data: message,
    xhrFields: {
        withCredentials: true
    },
    success: function(data, status, xhr) {
        console.log("Cookie: " + xhr.getResponseHeader("Set-Cookie"));
    }
});

cookieを取得し、 cookies-js を使用して保存したいと思います。

しかし http://www.w3.org/TR/XMLHttpRequest/#the-getallresponseheaders%28%29-method によると：

  1. すべての応答ヘッダー、Set-CookieまたはSet-Cookie2の大文字と小文字を区別しない一致であるヘッダーを除くを単一の文字列として返し、各ヘッダー行をU + 000D CR U + 000A =で区切りますLFペア。ステータス行を除く。各ヘッダー名とヘッダー値はU + 003A COLON U + 0020 SPACEペアで区切られている。

Chromeのネットワークツールを使用すると、レスポンスヘッダーに「Set-Cookie」が表示されます。また、curlを使用して「Set-Cookie」ヘッダーが表示されることも確認しました。

フロントエンドアプリにCookieを保存するにはどうすればよいですか？また、私のアプリはhttpsのみで実行されています。

リクエストに応じて詳細をお知らせします。

javascriptajaxcookieshttp-headershttpresponse
9
ton

JSでCookieデータを取得できません。 APIでは許可されません。

フロントエンドアプリにCookieを保存するにはどうすればよいですか？

Set-Cookieサーバー側コードからの応答のヘッダー。ブラウザは自動的に保存する必要があります。

開発者は、「開発者ツール」を使用してCookieの価値を調べることができます。

また、Cookieの有効期限が切れるまで、同じドメインへの後続のリクエストで同じCookieが送信されます。

13
Quentin

browserは、セキュリティ上の理由からajaxリクエストから受信したようなサードパーティCookieへのアクセスを許可できません。however自動的にそれらの世話をします！

これが機能するためには、次のことが必要です。

1）Cookieが返されると予想されるajaxリクエストでログインします：

$.ajax("https://example.com/v2/login", {
     method: 'POST',
     data: {login_id: user, password: password},
     crossDomain: true,
     success: login_success,
     error: login_error
  });

2）次のajaxリクエストでxhrFields: { withCredentials: true }を使用して接続し、ブラウザで保存された資格情報を使用します

$.ajax("https://example.com/v2/whatever", {
     method: 'GET',
     xhrFields: { withCredentials: true },
     crossDomain: true,
     success: whatever_success,
     error: whatever_error
  });

これらのCookieは、headersやdocument.cookieから読み取れない場合でも、ブラウザが処理します

ここで私の答えを参照してください： CookieをAJAX response？

7
MrE