ホームページ  >  記事  >  ウェブフロントエンド  >  ajaxを使ってjQueryを使ってドメインを越えてデータを取得する手順を詳しく解説

ajaxを使ってjQueryを使ってドメインを越えてデータを取得する手順を詳しく解説

php中世界最好的语言
php中世界最好的语言オリジナル
2018-04-24 16:54:271567ブラウズ

今回は、jQuery が ajax を使用してクロスドメイン データを取得する手順について詳しく説明します。jQuery が ajax を使用してドメインを越えてデータを取得するための 注意事項 は何ですか。実際のケースを見てみましょう。一見。

ajaxを使用してドメイン間でデータを取得するjQueryの簡単な例

var webMethod = "http://localhost:54473/Service1.asmx/HelloWorld"; 
    jQuery.support.cors = true;
    //之前没有加这句老是提示no transport,我没去深想。
    $.ajax
    ({
      
      type: "POST",
      contentType: "application/x-www-form-urlencoded",
      dataType: "html",
      url: "http://www.*****.com", //这里是网址
      success:function(data){alert(data);},
      timeout:30000, 
      error: function (XMLHttpRequest, textStatus, errorThrown) {
      alert(errorThrown);
      }
    });

パラメータオプションタイプ: オブジェクト

オプション。 AJAXリクエストの設定。すべてのオプションはオプションです。

async

タイプ: ブール

デフォルト値: true。デフォルトでは、すべてのリクエストは非同期です。同期リクエストを送信する必要がある場合は、このオプションを false に設定します。

同期リクエストはブラウザをロックするため、他のユーザー操作はリクエストが完了するまで待ってから実行する必要があることに注意してください。

beforeSend(XHR)

タイプ: Function

カスタム HTTP ヘッダーの追加など、リクエストを送信する前に XMLHttpRequest オブジェクトを変更できる関数。

XMLHttpRequest オブジェクトが唯一のパラメータです。

これは Ajax イベントです。 false が返された場合、この ajax リクエストはキャンセルできます。

cache

タイプ: Boolean

デフォルト値: true、dataType が script および jsonp の場合、デフォルトは false です。このページをキャッシュしない場合は false に設定します。

jQuery 1.2の新機能。

complete(XHR, TS)

タイプ: 関数

リクエスト完了後

コールバック関数 (リクエストが成功または失敗した後に呼び出されます)。

パラメータ: XMLHttpRequest オブジェクトとリクエストのタイプを説明する文字列。

これは Ajax イベントです。

contentType

タイプ: String

デフォルト値: "application/x-www-form-urlencoded"。サーバーに情報を送信するときのコンテンツのエンコード タイプ。

デフォルト値はほとんどの状況に適しています。 content-type を $.ajax() に明示的に渡すと、(送信するデータがない場合でも) 確実にサーバーに送信されます。

context

Type: Object

このオブジェクトは、Ajax 関連のコールバック関数のコンテキストを設定するために使用されます。つまり、コールバック関数の this がこのオブジェクトを指すようにします (このパラメーターが設定されていない場合、この AJAX リクエストを呼び出すときに渡されるオプション パラメーターを指します)。たとえば、コンテキスト パラメーターとして DOM 要素を指定すると、成功コールバック関数のコンテキストがこの DOM 要素に設定されます。

次のように:

$.ajax({ url: "test.html", context: document.body, success: function(){
    $(this).addClass("done");
   }});
data

Type: String

サーバーに送信されたデータ。リクエスト文字列形式に自動的に変換されます。 GET リクエストの URL に追加されます。この自動変換を無効にするには、processData オプションの説明を参照してください。キー/値形式である必要があります。配列の場合、jQuery は異なる値に同じ名前を自動的に割り当てます。たとえば、{foo:["bar1", "bar2"]} は '&foo=bar1&foo=bar2' に変換されます。

dataFilter

Type: Function

Ajax から返された元のデータを前処理するための関数。 data と type の 2 つのパラメータを指定します。data は Ajax によって返される元のデータで、type は jQuery.ajax を呼び出すときに提供される dataType パラメータです。関数によって返された値は、jQuery によってさらに処理されます。

dataType

Type: String

サーバーによって返されると予想される

データタイプ。指定しない場合、jQuery は HTTP パッケージの MIME 情報に基づいて自動的にインテリジェントな判断を行います。たとえば、XML の MIME タイプは XML として認識されます。 1.4 では、JSON が JavaScript オブジェクトを生成し、script がスクリプトを実行します。サーバーから返されたデータは、この値に基づいて解析され、コールバック関数に渡されます。使用可能な値:

•"xml": jQuery で処理できる XML ドキュメントを返します。

•"html": プレーンテキストの HTML 情報を返します。含まれている script タグは、DOM に挿入されると実行されます。

•「script」: プレーンテキストの JavaScript コードを返します。結果は自動的にキャッシュされません。 「キャッシュ」パラメータが設定されていない限り。注: リモート要求 (同じドメインの下ではない) を行う場合、すべての POST 要求は GET 要求に変換されます。 (読み込みにDOMスクリプトタグを使用するため)

•"json": JSONデータを返します。

•「jsonp」: JSONP形式。 「myurl?callback=?」などの JSONP 形式を使用して関数を呼び出すと、jQuery はコールバック関数を実行するために ? を自動的に正しい関数名に置き換えます。

•"text":プレーンテキスト文字列を返す
error
種類:関数

デフォルト値:自動判定(xmlまたはhtml)。この関数は、リクエストが失敗したときに呼び出されます。

には、XMLHttpRequest オブジェクト、エラー メッセージ、および (オプション) キャプチャされた例外オブジェクトの 3 つのパラメータがあります。

エラーが発生した場合、エラーメッセージ(第2パラメータ)はnullの他に「timeout」、「error」、「notmodified」、「parsererror」となる場合があります。

これは Ajax イベントです。

global
Type: Boolean

グローバル AJAX イベントをトリガーするかどうか。デフォルト値: true。 false に設定すると、さまざまな Ajax イベントの制御に使用できる ajaxStart や ajaxStop などのグローバル AJAX イベントはトリガーされません。

ifModified
Type: Boolean

サーバーデータが変更された場合にのみ新しいデータを取得します。デフォルト値: false。 HTTP パケットの Last-Modified ヘッダー情報を使用して決定します。 jQuery 1.4 では、サーバー指定の「etag」もチェックして、データが変更されていないことを確認します。

jsonp
Type: String

jsonp リクエスト内のコールバック関数の名前を書き換えます。この値は、{jsonp:'onJsonPLoad'} などの GET または POST リクエストの URL パラメーターの「コールバック」部分を置き換えるために使用され、「onJsonPLoad=?」がサーバーに渡されます。

jsonpCallback
Type: String

jsonpリクエストのコールバック関数名を指定します。この値は、j​​Query によって自動的に生成されるランダムな関数名の代わりに使用されます。これは主に、jQuery が一意の関数名を生成できるようにして、リクエストの管理やコールバック関数とエラー処理の提供を容易にするために使用されます。ブラウザで GET リクエストをキャッシュする場合は、このコールバック関数名を指定することもできます。

password
タイプ: String

HTTPアクセス認証リクエストに応答するために使用されるパスワード

processData
タイプ: Boolean

デフォルト値: true。デフォルトでは、data オプションを通じて渡されたデータは、それがオブジェクトである場合 (技術的に言えば、文字列でない限り)、デフォルトのコンテンツ タイプ「application/x」に一致するように処理され、クエリ文字列に変換されます。 -www-form-urlencoded" "。 DOM ツリー情報または変換したくないその他の情報を送信する場合は、false に設定します。

scriptCharset
Type: String

要求されたときの dataType が「jsonp」または「script」で、タイプが「GET」の場合にのみ、強制的に文字セットを変更するために使用されます。通常、ローカルとリモートのコンテンツのエンコーディングが異なる場合にのみ使用されます。

success
Type: Function

リクエストが成功した後のコールバック関数。

パラメータ: サーバーから返され、dataType パラメータに従って処理されたデータ。ステータスを説明する文字列。

これは Ajax イベントです。

traditional
型: Boolean

従来の方法でデータをシリアル化する場合は、true に設定します。 「ツール」カテゴリの「jQuery.param」メソッドを参照してください。

timeout
Type: Number

リクエストのタイムアウト (ミリ秒) を設定します。この設定はグローバル設定をオーバーライドします。

type
タイプ: String

デフォルト値: "GET")。リクエストメソッド (「POST」または「GET」)、デフォルトは「GET」です。注: PUT や DELETE などの他の HTTP リクエスト メソッド も使用できますが、一部のブラウザーでのみサポートされています。

url
タイプ: String

デフォルト値: 現在のページのアドレス。リクエストの送信先のアドレス。

username
Type: String

HTTP アクセス認証リクエストに応答するために使用されるユーザー名。

xhr
タイプ: Function

XMLHttpRequest オブジェクトを返す必要があります。デフォルトは、IE の場合は ActiveXObject、それ以外の場合は XMLHttpRequest です。拡張された XMLHttpRequest オブジェクトをオーバーライドまたは提供するために使用されます。このパラメーターは、jQuery 1.3 より前では使用できませんでした。

この記事の事例を読んだ後は、この方法を習得したと思います。さらに興味深い情報については、php 中国語 Web サイトの他の関連記事に注目してください。

推奨読書:

Ajax使用歴5年

Ajaxを使用したクロスドメインアクセスのための3つの方法のまとめ

JSでAjaxを使用するスキルの詳細な分析

以上がajaxを使ってjQueryを使ってドメインを越えてデータを取得する手順を詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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