Lightning コンポーネント開発者ガイド
jサーバ側のアクションのコール
クライアント側コントローラは、名前-値のペアを含む、オブジェクトリテラル表記の JavaScript オブジェクトです。この名前はそれぞれクライアント側のアクションに対応します。この値は、アクションに関連付けられた関数コードです。
コンポーネントからサーバコールをトリガするとします。次のコンポーネントには、クライアント側コントローラの echo アクションに接続されるボタンが含まれます。SimpleServerSideController には、クライアント側コントローラから渡される文字列を返すメソッドが含まれます。
1<aura:component controller="SimpleServerSideController">
2 <aura:attribute name="firstName" type="String" default="world"/>
3 <ui:button label="Call server" press="{!c.echo}"/>
4</aura:component>このクライアント側コントローラには、サーバ側コントローラで serverEcho メソッドを実行する echo アクションが含まれます。
1({
2 "echo" : function(cmp) {
3 // create a one-time use instance of the serverEcho action
4 // in the server-side controller
5 var action = cmp.get("c.serverEcho");
6 action.setParams({ firstName : cmp.get("v.firstName") });
7
8 // Create a callback that is executed after
9 // the server-side action returns
10 action.setCallback(this, function(response) {
11 var state = response.getState();
12 // This callback doesn’t reference cmp. If it did,
13 // you should run an isValid() check
14 //if (cmp.isValid() && state === "SUCCESS") {
15 if (state === "SUCCESS") {
16 // Alert the user with the value returned
17 // from the server
18 alert("From server: " + response.getReturnValue());
19
20 // You would typically fire a event here to trigger
21 // client-side notification that the server-side
22 // action is complete
23 }
24 //else if (cmp.isValid() && state === "INCOMPLETE") {
25 else if (state === "INCOMPLETE") {
26 // do something
27 }
28 //else if (cmp.isValid() && state === "ERROR") {
29 else if (state === "ERROR") {
30 var errors = response.getError();
31 if (errors) {
32 if (errors[0] && errors[0].message) {
33 console.log("Error message: " +
34 errors[0].message);
35 }
36 } else {
37 console.log("Unknown error");
38 }
39 }
40 });
41
42 // optionally set storable, abortable, background flag here
43
44 // A client-side action could cause multiple events,
45 // which could trigger other events and
46 // other server-side action calls.
47 // $A.enqueueAction adds the server-side action to the queue.
48 $A.enqueueAction(action);
49 }
50})クライアント側コントローラでは、c の値プロバイダを使用してサーバ側コントローラのアクションを呼び出します。また、マークアップでこの c 構文を使用して、クライアント側コントローラのアクションも呼び出します。
cmp.get("c.serverEcho") コールは、サーバ側コントローラで serverEcho メソッドをコールしていることを示します。サーバ側コントローラのメソッド名は、クライアント側のコールの c. に続く内容と完全に一致している必要があります。この場合、それは serverEcho です。
action.setParams() を使用して、サーバ側コントローラに渡される引数を設定します。次のコールは、firstName 属性値に基づいて、サーバ側コントローラの serverEcho メソッドで firstName 引数の値を設定します。
1action.setParams({ firstName : cmp.get("v.firstName") });action.setCallback() は、サーバ側のアクションが返されたら呼び出されるコールバックアクションを設定します。
1action.setCallback(this, function(response) { ... });サーバ側のアクションの結果は、コールバックの引数である response 変数に格納されます。
response.getState() は、サーバから返されたアクションの状態を取得します。
response.getReturnValue() は、サーバから返された値を取得します。この例では、コールバック関数がユーザにサーバから返された値を含むアラートを表示します。
$A.enqueueAction(action) により、サーバ側コントローラのアクションがアクション実行キューに追加されます。キューに追加されたアクションはすべて、イベントループの最後に実行されます。フレームワークでは、個々のアクションごとに個別の要求を送信するのではなく、イベントチェーンを処理し、キューのアクションを 1 つの要求にまとめます。これらのアクションは非同期で、コールバックが設定されます。
アクションの状態
アクションの有効な状態は次のとおりです。
- NEW (新規)
- アクションが作成されていますが、まだ処理されていません。
- RUNNING (実行中)
- アクションを処理中です。
- SUCCESS (成功)
- アクションが正常に実行されました。
- ERROR (エラー)
- サーバからエラーが返されました。
- INCOMPLETE (未完了)
- サーバから応答が返されませんでした。サーバがダウンしているか、クライアントがオフラインである可能性があります。フレームワークは、コンポーネントが有効である限り、アクションのコールバックが常に呼び出されることを保証します。サーバへのソケットが一度も正常に開いていない場合や突然閉じた場合、または他のネットワークエラーが生じた場合は、XHR が解決され、状態が INCOMPLETE のコールバックが呼び出されます。
- ABORTED (中止)
- アクションが中止されました。