文档

§Javascript 路由

Play 路由器能够生成 Javascript 代码,用于处理从客户端运行的 Javascript 回到应用程序的路由。Javascript 路由器有助于重构应用程序。如果您更改了 URL 结构或参数名称,您的 Javascript 会自动更新以使用新的结构。

§生成 Javascript 路由器

使用 Play 的 Javascript 路由器的第一步是生成它。路由器只会公开您明确声明的路由,从而最大限度地减少 Javascript 代码的大小。

有两种方法可以生成 Javascript 路由器。一种是使用模板指令将路由器嵌入 HTML 页面。另一种是在操作中生成 Javascript 资源,这些资源可以下载、缓存并在页面之间共享。

§嵌入式路由器

可以使用 Twirl 模板中的 @javascriptRouter 指令生成嵌入式路由器。这通常在主装饰模板中完成。

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

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

第一个参数是路由器将放置在其中的全局变量的名称。第二个参数是要包含在此路由器中的 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)

在实现此操作并将其添加到您的路由文件后,您就可以将其作为资源包含在您的模板中

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

§使用路由器

以 jQuery 为例,进行调用就像

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

路由器还提供了一些其他属性,包括 urltype(HTTP 方法)。例如,上面对 jQuery 的 ajax 函数的调用也可以像这样进行

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

在需要设置其他属性(如 success、error、context 等)的情况下,需要使用上述方法。

absoluteURLwebSocketURL 是方法(而不是属性),它们返回完整的 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 路由器方法的对象,并且应该期望路由器已将 typeurl 属性设置为路由器请求的适当方法和 URL。

要定义此函数,请在您的操作中传递 ajaxMethod 方法参数,例如:

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

下一步:嵌入式路由 DSL


发现此文档中的错误?此页面的源代码可以在 此处 找到。在阅读 文档指南 后,请随时贡献拉取请求。有疑问或建议要分享?前往 我们的社区论坛 与社区开始对话。