jqueryフロントエンドを使用してドメイン間でデータをリクエストする方法

フロントエンド開発では、さまざまなサーバーからデータをリクエストすることが必要になることがよくあります。ただし、同一生成元ポリシーの制限により、ドメインを越えてデータを直接リクエストすることはできません。この問題を解決するには、jQuery が提供するメソッドを使用できます。

1. クロスドメイン リクエスト データとは

クロスドメイン リクエスト データとは、クライアント (ブラウザ) を経由して別のサーバーにリクエストを送信してデータを取得することを指します。開発データを終了します。セキュリティ上の理由から、ブラウザは、送信元が異なるサーバーからのリクエストを制限します。同一オリジンとは、2 つのページのプロトコル、ポート、ホスト名が同じであることを意味します。ドメイン間でデータをリクエストする一般的な状況は、フロントエンド ページで Ajax を介して別のサーバーにデータをリクエストすることです。

2. クロスドメイン データ リクエストが必要な理由

クロスドメイン データ リクエストは、フロントエンド開発において非常に一般的な状況です。理由はいくつかあります。

• フロントエンドとバックエンドのロジックを分離する: フロントエンドとバックエンドの開発は 2 つの異なるチームによって完了することが多く、それぞれのコードを実行するには異なるサーバーが必要です。ドメイン間でデータを要求することにより、フロントエンドとバックエンドの間の論理的な分離をより明確にすることができます。
• リソースの保存: 一部の商用サービスは API インターフェイスのみを提供し、フロントエンド リソースを提供しない場合があります。現時点では、サービスを呼び出す必要がある場合は、ドメイン全体でデータをリクエストする必要があります。
• 複数のフロントエンド サーバーがデータを共有する: 場合によっては、異なるフロントエンド サーバーが同じバックエンド サービスにアクセスする必要があり、この場合、クロスドメイン データ要求が必要になります。

3. クロスドメイン データ リクエストを解決する方法

同一オリジン ポリシーの制限により、クロスドメイン データを直接リクエストすることはできませんが、

• JSONP: JavaScript はクロスドメイン リクエストをネイティブにサポートしていませんが、
  • Vue で親コンポーネントから子コンポーネントの echart に値を渡す際の問題
  • React このバインディングに関するいくつかの考え
  • Django はリクエストを使用してブラウザから送信されたパラメータを取得します
  • JQuery での DOM 操作 - ラップ
  • プロトタイプおよびプロトタイプチェーンの関連コンテンツの説明