§Javascript ルーティング

Play ルーターは、クライアント側で実行されている Javascript からアプリケーションへのルーティングを処理する Javascript コードを生成できます。Javascript ルーターは、アプリケーションのリファクタリングに役立ちます。URL やパラメータ名の構造を変更すると、Javascript はその新しい構造を使用するように自動的に更新されます。

§Javascript ルーターの生成

Play の Javascript ルーターを使用する最初のステップは、それを生成することです。ルーターは明示的に宣言したルートのみを公開するため、Javascript コードのサイズを最小限に抑えることができます。

Javascript ルーターを生成する方法は 2 つあります。1 つはテンプレートディレクティブを使用してルーターを HTML ページに埋め込む方法です。もう 1 つは、ダウンロード、キャッシュ、およびページ間で共有できるアクションで Javascript リソースを生成する方法です。

§埋め込みルーター

埋め込みルーターは、Twirl テンプレート内で @javascriptRouter ディレクティブを使用して生成できます。これは通常、メインの装飾テンプレート内で行われます。

@()(implicit request: play.mvc.Http.Request)

@helper.javascriptRouter("jsRoutes")(
    routes.javascript.Users.list,
    routes.javascript.Users.get
)

最初のパラメータは、ルーターが配置されるグローバル変数の名前です。2 番目のパラメータは、このルーターに含める必要がある Javascript ルートのリストです。

§ルーターリソース

ルーターリソースは、ルータージェネレーターを呼び出すアクションを作成することで生成できます。テンプレートにルーターを埋め込むのと同様の構文があります。

import play.mvc.Controller;
import play.mvc.Http;
import play.mvc.Result;
import play.routing.JavaScriptReverseRouter;

public Result javascriptRoutes(Http.Request request) {
  return ok(JavaScriptReverseRouter.create(
          "jsRoutes",
          "jQuery.ajax",
          request.host(),
          routes.javascript.Users.list(),
          routes.javascript.Users.get()))
      .as(Http.MimeTypes.JAVASCRIPT);
}

次に、対応するルートを追加します

GET     /javascriptRoutes      controllers.Application.javascriptRoutes(request: Request)

このアクションを実装し、それを routes ファイルに追加したら、テンプレートにリソースとして含めることができます

<script type="text/javascript" src="@routes.Application.javascriptRoutes"></script>

§ルーターの使用

jQuery を例にとると、呼び出しは次のようになります。

$.ajax(jsRoutes.controllers.Users.get(someId))
  .done( /*...*/ )
  .fail( /*...*/ );

ルーターは、url や type（HTTP メソッド）など、いくつかの他のプロパティも利用できるようにします。たとえば、上記の jQuery の ajax 関数への呼び出しは、次のように行うこともできます。

var r = jsRoutes.controllers.Users.get(someId);
$.ajax({url: r.url, type: r.type, success: /*...*/, error: /*...*/ });

上記の例は、success、error、context など、他のプロパティを設定する必要がある場合に必要です。

absoluteURL および webSocketURL は、（プロパティではなく）完全な URL 文字列を返すメソッドです。WebSocket 接続は次のように行うことができます。

var r = jsRoutes.controllers.Users.list();
var ws = new WebSocket(r.webSocketURL());
ws.onmessage = function(msg) {
        /*...*/
};

§jQuery ajax メソッドのサポート

注: jQuery の ajax 関数に対する組み込みサポートは、将来のリリースで削除されます。組み込みサポートに関するこのセクションは、参照目的のみに提供されています。新しいコードではルーターの ajax 関数を使用しないでください。また、既存のコードはできるだけ早くアップグレードすることを検討してください。ルーターの使用に関する前のセクションでは、jQuery をどのように使用すべきかを説明しています。

jQuery が好きでない場合、または jQuery の ajax メソッドを何らかの方法で装飾したい場合は、ajax クエリの実行に使用する関数をルーターに提供できます。この関数は、ajax ルーターメソッドに渡されるオブジェクトを受け入れ、ルーターがルーターリクエストの適切なメソッドと URL に type および url プロパティを設定していることを想定する必要があります。

この関数を定義するには、アクションで ajaxMethod メソッドパラメータを渡します。例:

JavaScriptReverseRouter.create(
    "jsRoutes",
    "myAjaxMethod",
    request.host(),
    routes.javascript.Users.list(),
    routes.javascript.Users.get())

次へ: 埋め込み型ルーティング DSL

このドキュメントにエラーが見つかりましたか？このページのソースコードはこちらにあります。ドキュメントのガイドラインを読んだ後、プルリクエストを自由にご投稿ください。質問や共有できるアドバイスはありますか？コミュニティフォーラムに参加して、コミュニティとの会話を始めましょう。