YUI3:GET
Getツールは、ページのロードが完了した後、スクリプトとcssリソース(ドメイン間リソースを含む)をDOMに追加するメカニズムを提供します.
Getツールの2つの一般的な使用例:
1.インバウンド・データ取得:XMLhttplRequest(YUI IO UtilityもXMLhttpRequestを使用する)は厳格な同源ポリシーに依存するため、XHRによるサード・パーティのデータ取得にはサーバ・エージェントが必要です.(XMLHttpRequestの動作原理を具体的に検索してください).制御または完全に信頼できるドメイン間リソースであれば、サービス側エージェントを介さずにscriptデータを直接ロードして異なるソースからロードすることができます.scriptファイルは、典型的なjsonフォーマットのデータかもしれませんが、loadのときにすぐに実行されます.ブラウザがこれらのコードを完全な権限で実行するため、script fileに悪辣なコードがある場合、ユーザーが悪辣なコードの影響を受けないことを保証する安全なメカニズムはありません.信頼できないデータ・ソースにユーザーを接触させないでください.
2.逐次ロード方法:リッチクライアントアプリケーションにおいて、ユーザーによる動的ロードに必要なjsファイルとcssファイルが非常に有用になり、Get utilityは動的ロードリソースの機能を提供する.(注意:YUI内のリソースをロードする場合はYUI loaderを使用してロードし、YUILoaderはGet Utilityを使用してYUIコンポーネントをロードし、YUIコンポーネント依存の問題を解決します).
スタート
Get Utilityトランザクションの構成(Configuring a Get Utility Transaction.翻訳方法)
あなたに提供されるコールバック関数のパラメータを使用します.
Getting StartedConfiguring a Get Utility TransactionMaking Use of Arguments Supplied to Your CallbackUsing the Get Utility to Insert Script NodesUsing the Get Utilty to Insert CSS FilesUsing JSONP Web ServicesHow is the Get Utility Different From IO?YUI on Mobile Devices
スタート
スクリプト(Y.Get.script()and/or CSS(Y.Get.css())リソースをページに取得できます.scriptメソッドとcssメソッドには、次のパラメータがあります.
1.URL(s):ページにロードするURL(s)を指定します.URL(s)は文字列または文字列配列である可能性があります.
2.options:transaction(インタラクティブ?)を含むオプションの構成オブジェクトの情報;もっと詳しくは後述します.
簡単なファイルリクエストは次のようになります.
YUI().YUI().use(function(Y) { var url = http://search.yahooapis.com/SiteExplorerService/V1/inlinkData?"+ "appid=3wEDxLHV34HvAU2lMnI51S4Qra5m.baugqoSv4gcRllqqVZm3UrMDZWToMivf5BJ3Mom"+ "&results=20&output=json&omit_inlinks=domain"+ "&callback=YAHOO.example.SiteExplorer.callback"+ "&query=http://developer.yahoo.com/yui/", obj = Y.Get.script(url, { onSuccess: function() { alert("file loaded"); }; });//'OBj'はメンバーが1人しかいないオブジェクトであり、tID、//transactionの一意のアイデンティティ識別子であり、//「q 0」、「q 1」、「q 2」..."qn"will be an object with a });
Get Utility Transactionの構成
2番目のパラメータでscriptメソッドとcssメソッドを構成します.このオプションのパラメータには、次のフィールドを含むオブジェクトが含まれます.
選択項目の役割の構成
onSuccess
(function) Callback method invoked by Get Utility when the requested file(s) have loaded successfully.
onFailure
(function) Callback method invoked by Get Utility when an error is detected or
onProgress
(function) Callback method invoked by Get Utility after each node is inserted.
onTimeout
(function) Callback method invoked by Get Utility if a timeout is detected.
onEnd
(function) Callback method invoked by Get Utility when a transaction completes no matter how the transaction ended.
attributes
(object) A hash of attributes to apply to the dynamically created nodes. You might use this to add media="print"to a css file, for example.
win
(window) The
context
(object) The execution context in which all callbacks will run. Default: the current
data
(any) Data to pass as an argument to
autopurge
(boolean) If set to true, script nodes will automatically be removed every 20 transactions (this number is globally configurable via the
timeout
(int) Number of milliseconds to wait for a script to finish loading before timing out
コールバック関数に提供されるパラメータの使用
上記のセクションのように、onSuccessでもonFailureでもコールバック関数を使用すると、コンフィギュレーションオブジェクトに提供されるdataメンバー(configurationでこのようなdataメンバーがすでに提供されているように、上記の表のように)を使用できます.もちろん、dataというメンバーだけが使用できるわけではありませんが、次のメンバーも使用できます.
(簡単に言えば、onSuccessまたはonFailure関数では、次のパラメータを使用できます.)
FIELD CONTENTS
tId
(string) The unique identifier for this transaction; this string is available as the
data
(any) The
nodes
(array) An array containing references to node(s) created in processing the transaction. These will be script nodes for JavaScript and link nodes for CSS.
win
(window) The window object in which the nodes were created.
purge()
(function) Calling the returned
Get Utilityを使用してスクリプトノードvar successHandler=function(o){//oを挿入します.上記の表に記載されているすべてのドメインが含まれます.o.purge();//実行後すぐにscriptスクリプトノードを削除します.Y.log(o.data);//構成オブジェクトに渡されるdataメンバー}var objTransaction=Y.Get.script("http://json.org/json.js", { onSuccess: successHandler, data: { field1: value1, field2: value2 } })
Y.Get.を使用する場合script()メソッドで1つ以上のスクリプトファイルをページに追加すると、Get Utilityは次の手順に従います.
1.スクリプトファイルを要求するターゲットウィンドウにスクリプトノードをロードする
2.新しいスクリプトのsrc属性を指定したURLに設定
3.transactionが成功した場合、スクリプトがロードされて実行されます.
4.スクリプトノードのload時間が励起される
5.Get Utilityより多くのURLがあるかどうかを確認し、ある場合は最初のステップに戻ります.
6.これが最後の場合、Get UtilityはonSuccessコールバック関数を起動します(コールバック関数が指定されている場合)
次のようになります.
var handlerData={//success or failureハンドルに渡されるデータ.//上のようです.};var successHandler = function(oData) {//code to execute when all requested scripts have been//loaded; this code can make use of the contents of those//scripts, whether it's functional code or JSON data. }; var aURLs=["/url 1.js"、"/url 2.js"、"/url 3.js"//など...];Y.Get.script(aURLs, { onSuccess: successHandler, data: handlerData });
Get Utilityを使用してCSSファイルを挿入
Y.Getを使うとcss()メソッドで1つ以上のCSSファイルをページに追加する場合、Get Utilityは上記のスクリプト手順に従います.FirefoxとSafariでは互換性がありません.
Getツールの2つの一般的な使用例:
1.インバウンド・データ取得:XMLhttplRequest(YUI IO UtilityもXMLhttpRequestを使用する)は厳格な同源ポリシーに依存するため、XHRによるサード・パーティのデータ取得にはサーバ・エージェントが必要です.(XMLHttpRequestの動作原理を具体的に検索してください).制御または完全に信頼できるドメイン間リソースであれば、サービス側エージェントを介さずにscriptデータを直接ロードして異なるソースからロードすることができます.scriptファイルは、典型的なjsonフォーマットのデータかもしれませんが、loadのときにすぐに実行されます.ブラウザがこれらのコードを完全な権限で実行するため、script fileに悪辣なコードがある場合、ユーザーが悪辣なコードの影響を受けないことを保証する安全なメカニズムはありません.信頼できないデータ・ソースにユーザーを接触させないでください.
2.逐次ロード方法:リッチクライアントアプリケーションにおいて、ユーザーによる動的ロードに必要なjsファイルとcssファイルが非常に有用になり、Get utilityは動的ロードリソースの機能を提供する.(注意:YUI内のリソースをロードする場合はYUI loaderを使用してロードし、YUILoaderはGet Utilityを使用してYUIコンポーネントをロードし、YUIコンポーネント依存の問題を解決します).
スタート
Get Utilityトランザクションの構成(Configuring a Get Utility Transaction.翻訳方法)
あなたに提供されるコールバック関数のパラメータを使用します.
Getting StartedConfiguring a Get Utility TransactionMaking Use of Arguments Supplied to Your CallbackUsing the Get Utility to Insert Script NodesUsing the Get Utilty to Insert CSS FilesUsing JSONP Web ServicesHow is the Get Utility Different From IO?YUI on Mobile Devices
スタート
スクリプト(Y.Get.script()and/or CSS(Y.Get.css())リソースをページに取得できます.scriptメソッドとcssメソッドには、次のパラメータがあります.
1.URL(s):ページにロードするURL(s)を指定します.URL(s)は文字列または文字列配列である可能性があります.
2.options:transaction(インタラクティブ?)を含むオプションの構成オブジェクトの情報;もっと詳しくは後述します.
簡単なファイルリクエストは次のようになります.
YUI().YUI().use(function(Y) { var url = http://search.yahooapis.com/SiteExplorerService/V1/inlinkData?"+ "appid=3wEDxLHV34HvAU2lMnI51S4Qra5m.baugqoSv4gcRllqqVZm3UrMDZWToMivf5BJ3Mom"+ "&results=20&output=json&omit_inlinks=domain"+ "&callback=YAHOO.example.SiteExplorer.callback"+ "&query=http://developer.yahoo.com/yui/", obj = Y.Get.script(url, { onSuccess: function() { alert("file loaded"); }; });//'OBj'はメンバーが1人しかいないオブジェクトであり、tID、//transactionの一意のアイデンティティ識別子であり、//「q 0」、「q 1」、「q 2」..."qn"will be an object with a });
Get Utility Transactionの構成
2番目のパラメータでscriptメソッドとcssメソッドを構成します.このオプションのパラメータには、次のフィールドを含むオブジェクトが含まれます.
選択項目の役割の構成
onSuccess
(function) Callback method invoked by Get Utility when the requested file(s) have loaded successfully.
onFailure
(function) Callback method invoked by Get Utility when an error is detected or
abort is called. onProgress
(function) Callback method invoked by Get Utility after each node is inserted.
onTimeout
(function) Callback method invoked by Get Utility if a timeout is detected.
onEnd
(function) Callback method invoked by Get Utility when a transaction completes no matter how the transaction ended.
attributes
(object) A hash of attributes to apply to the dynamically created nodes. You might use this to add media="print"to a css file, for example.
win
(window) The
window into which the loaded resource(s) will be inserted. Default: Y.config.win . context
(object) The execution context in which all callbacks will run. Default: the current
YUI instance. data
(any) Data to pass as an argument to
onSuccess or onFailure callbacks. Default: null . autopurge
(boolean) If set to true, script nodes will automatically be removed every 20 transactions (this number is globally configurable via the
Y.Get.PURGE_THRESH property); script nodes can be safely removed in most cases, as their contents (having executed) remain available. CSS nodes should not have this set to true as it will remove the CSS rules. Default: true for script nodes, false for CSS nodes. timeout
(int) Number of milliseconds to wait for a script to finish loading before timing out
コールバック関数に提供されるパラメータの使用
上記のセクションのように、onSuccessでもonFailureでもコールバック関数を使用すると、コンフィギュレーションオブジェクトに提供されるdataメンバー(configurationでこのようなdataメンバーがすでに提供されているように、上記の表のように)を使用できます.もちろん、dataというメンバーだけが使用できるわけではありませんが、次のメンバーも使用できます.
(簡単に言えば、onSuccessまたはonFailure関数では、次のパラメータを使用できます.)
FIELD CONTENTS
tId
(string) The unique identifier for this transaction; this string is available as the
tId member of the object returned to you upon calling the script or css method. data
(any) The
data field you passed in your configuration object when the script or css method was called. Default: null . nodes
(array) An array containing references to node(s) created in processing the transaction. These will be script nodes for JavaScript and link nodes for CSS.
win
(window) The window object in which the nodes were created.
purge()
(function) Calling the returned
purge() method will immediately remove the created nodes. This is safe and prudent for JavaScript nodes, which do not need to persist. If CSS nodes are purged, the rules they contain are no longer available and the page will repaint accordingly. Get Utilityを使用してスクリプトノードvar successHandler=function(o){//oを挿入します.上記の表に記載されているすべてのドメインが含まれます.o.purge();//実行後すぐにscriptスクリプトノードを削除します.Y.log(o.data);//構成オブジェクトに渡されるdataメンバー}var objTransaction=Y.Get.script("http://json.org/json.js", { onSuccess: successHandler, data: { field1: value1, field2: value2 } })
Y.Get.を使用する場合script()メソッドで1つ以上のスクリプトファイルをページに追加すると、Get Utilityは次の手順に従います.
1.スクリプトファイルを要求するターゲットウィンドウにスクリプトノードをロードする
2.新しいスクリプトのsrc属性を指定したURLに設定
3.transactionが成功した場合、スクリプトがロードされて実行されます.
4.スクリプトノードのload時間が励起される
5.Get Utilityより多くのURLがあるかどうかを確認し、ある場合は最初のステップに戻ります.
6.これが最後の場合、Get UtilityはonSuccessコールバック関数を起動します(コールバック関数が指定されている場合)
次のようになります.
var handlerData={//success or failureハンドルに渡されるデータ.//上のようです.};var successHandler = function(oData) {//code to execute when all requested scripts have been//loaded; this code can make use of the contents of those//scripts, whether it's functional code or JSON data. }; var aURLs=["/url 1.js"、"/url 2.js"、"/url 3.js"//など...];Y.Get.script(aURLs, { onSuccess: successHandler, data: handlerData });
Get Utilityを使用してCSSファイルを挿入
Y.Getを使うとcss()メソッドで1つ以上のCSSファイルをページに追加する場合、Get Utilityは上記のスクリプト手順に従います.FirefoxとSafariでは互換性がありません.