§JavaScript ルーティング

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

§JavaScriptルータの生成

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

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

§埋め込みルータ

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

@()(implicit req: play.api.mvc.RequestHeader)

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

最初のパラメータは、ルータが配置されるグローバル変数の名前です。 2番目のパラメータは、このルータに含める必要があるJavaScriptルートのリストです。上記のように、この関数を使用するには、テンプレートに暗黙的な`RequestHeader`がスコープ内にある必要があります。

§ルータリソース

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

import javax.inject.Inject

import play.api.http.MimeTypes
import play.api.mvc._
import play.api.routing._

def javascriptRoutes: Action[AnyContent] = Action { implicit request =>
  Ok(
    JavaScriptReverseRouter("jsRoutes")(
      routes.javascript.Users.list,
      routes.javascript.Users.get
    )
  ).as(MimeTypes.JAVASCRIPT)
}

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

GET     /javascriptRoutes      controllers.Application.javascriptRoutes

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

<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`ルータメソッドに渡されるオブジェクトを受け入れる必要があり、ルータが`type`プロパティと`url`プロパティをルータリクエストの適切なメソッドとURLに設定していることを期待する必要があります。

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

JavaScriptReverseRouter("jsRoutes", Some("myAjaxFunction"))(
  routes.javascript.Users.list,
  routes.javascript.Users.get
)

**次:** カスタムバインディング

このドキュメントに誤りが見つかりましたか？このページのソースコードはこちらにあります。ドキュメントガイドラインを読んだ後、プルリクエストを送信してください。質問やアドバイスがありますか？コミュニティフォーラムにアクセスして、コミュニティとの会話を開始してください。