ホームページ  >  記事  >  ウェブフロントエンド  >  jQueryを使用してAJAX POSTリクエストでカスタムヘッダーを送信するにはどうすればよいですか?

jQueryを使用してAJAX POSTリクエストでカスタムヘッダーを送信するにはどうすればよいですか?

Patricia Arquette
Patricia Arquetteオリジナル
2024-11-05 11:45:02936ブラウズ

How to Send Custom Headers in AJAX POST Requests with jQuery?

jQuery を使用した AJAX POST リクエストのカスタム ヘッダー

jQuery で開始された AJAX POST リクエストには、カスタム ヘッダーを含めることができます。ただし、ヘッダーを追加するメカニズムは一般的なアプローチとは異なります。

次の例に示すようにヘッダーを指定すると、

$.ajax({
    type: 'POST',
    url: url,
    headers: {
        "My-First-Header":"first value",
        "My-Second-Header":"second value"
    }
}).done(function(data) {
    alert(data);
});

当然のことながら、ヘッダーは次のように送信されることが期待されます。

My-First-Header: first value
My-Second-Header: second value

ただし、ブラウザーのセキュリティ対策により、最初のリクエストでカスタム ヘッダー値を直接送信することはできません。代わりに、それらは Access-Control-Request-Headers ヘッダーに配置されます。これは、プリフライト リクエストとして知られるセキュリティ メカニズムです。

後続のリクエストに実際のヘッダー値を含めることを許可するには、サーバーは必要な CORS (Cross-Origin Resource Sharing) ヘッダーを構成する必要があります。

これに対する解決策は、指定されたサンプル コードに示すように、別の方法でヘッダーを送信することです。

$.ajax({
  type: "POST",
  beforeSend: function(request) {
    request.setRequestHeader("Authority", authorizationToken);
  },
  url: "entities",
  data: "json=" + escape(JSON.stringify(createRequestObject)),
  processData: false,
  success: function(msg) {
    $("#results").append("The result =" + StringifyPretty(msg));
  }
});

このアプローチでは、実際には、Access をバイパスして、リクエスト ヘッダーの値を直接設定します。 Control-Request-Header の配置。これにより、サーバー構成を必要とせずに、最初のリクエストでカスタム ヘッダーを送信する方法が提供されます。

以上がjQueryを使用してAJAX POSTリクエストでカスタムヘッダーを送信するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。