私のブラウザがクロスオリジン応答からの Cookie を設定しないのはなぜですか?

ブラウザがクロスオリジン応答からの Set-Cookie ヘッダーの尊重を拒否します

問題:

アプリケーションは、バックエンドからフロントに送信される HTTP Cookie を設定して保持するのに苦労します

詳細:

• バックエンドは応答ヘッダーで Cookie を正しく送信します。
• フロントエンドは Axios を使用してリクエストを送信します、ただし、Cookie はローカルに設定されていません。
• API ルーターには必要なヘッダーと CORS があります。 Cookie を許可する設定。

解決策:

エラーは、Axios リクエスト構成内の withCredentials の配置にあります。 withCredentials はリクエストのプロパティであり、リクエスト ヘッダーではありません。この問題を解決するには、ヘッダー オブジェクトから最上位の構成オブジェクトに移動する必要があります。

修正コード:

const axiosAuth = axios.create({
  validateStatus: (status: number) => {
    return status >= 200 && status < 300;
  },
  headers: {
    Accept: `application/json`,
    'Content-Type': 'application/json',
  },
  withCredentials: true,
});

withCredentials を使用: true構成オブジェクトでは、Axios がクロスオリジン Cookie の設定と取得を自動的に処理します。

以上が私のブラウザがクロスオリジン応答からの Cookie を設定しないのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。