玩！框架：在单独的 JavaScript 文件中使用 URL 的最佳实践？

Question

我目前正在重新组织一个Play！ JS较多的项目 HTML 模板文件中的代码。该代码应移至外部 JS 文件具有更好的可读性和更快的页面加载时间。然而， 当我刚刚在 public 文件夹中创建一个 JS 文件时，所有 @{Controller.method} 链接替换不再起作用。我是 考虑从 HTML 调用一些初始化函数 只提供所需 URL 的模板，

initialize({ "Application.doThis" : "@{Application.doThis}"})

但是对于任何 URL 来说，这都变得非常麻烦且容易出错 这是添加的。另一件事是，I18N 也不再起作用。所以 对于这样的场景，您有自己的最佳实践是什么？ JS 代码位于单独的文件中，但仍想使用 URL 生成和 你的 JS 中有 I18N 吗？

Answer 1

在主模板中，生成一个“Javascript 路由器”，如下所示：

<script>
    var routes = {
        doThis: #{jsAction @Application.doThis(user, ':param1', ':param2') /},
        doThat: #{jsAction @doThat() /}
    } 
</script>

然后在任何“静态”javascript 文件中，使用此路由器：

$.get(routes.doThis({param1: x, param2: 'yop'}))

Answer 2

诀窍是让框架解析您的 javascript、CSS 或静态目录中的任何其他内容。这是一个简单的解决方案。

添加 controllers.StaticParser 控制器：

package controllers;
import play.mvc.Controller;

public class StaticParser extends Controller {
    public static void parse(String route) {
        render("/" + route);
    }
}

在您的 conf/routes 文件中添加：

GET  /parse/{<.*>route} StaticParser.parse

该路由中的正则表达式非常重要，否则您无法向请求添加路径。
要请求已解析的静态资源，例如 js 脚本，请使用：

<script src="/parse/public/javascripts/test.js"
   language="javascript" type="text/javascript" ></script>

不幸的是，您不能使用 #{script 'test.js' /} 格式，因为 script 标记会查找静态资源文件。为了纠正这种令人厌烦的情况，这里有一个对 script 标签的无耻修改：#{parsescript 'test.js'/} 标签。它应该转到 /views/tags/parsescript.tag：

{
 *  insert a parsescript tag in the template.
 *  by convention, referred script must be put under /public/javascripts
 *    src     (required)   : script filename, without the leading path "/public/javascripts"
 *    id      (opt.)       : sets script id attribute
 *    charset (opt.)       : sets source encoding - defaults to current response encoding
 *
 *    #{parsescript id:'datepicker' , src:'ui/ui.datepicker.js', charset:'${_response_encoding}' /}
}*
%{
    (_arg ) && (_src = _arg);

    if (!_src) {
        throw new play.exceptions.TagInternalException("src attribute cannot be empty for script tag");
    }
    _src = "/public/javascripts/" + _src
    try {
        _abs = play.mvc.Router.reverseWithCheck(_src, play.Play.getVirtualFile(_src), false);
    } catch (Exception ex) {
        throw new play.exceptions.TagInternalException("File not found: " + _src);
    }
}%
<script type="text/javascript" language="javascript"#{if _id} id="${_id}"#{/if}#{if _charset} charset="${_charset}"#{/if}  src="/parse${_abs}"></script>

它的工作方式与 #{script /} 标记完全相同，但在返回文件之前解析文件：#{parsescript 'test.js' /}

人们同样可以无耻地破解 #{stylesheet /} 标签，但我认为我已经占用了足够的空间。

---