4

我正在计划一个带有backbone.js 和一个运行jersey 的java 后端的单页webapp。我有兴趣在初始加载时将模型数据引导到页面中，以防止额外的 ajax 请求，正如主干.js 文档所建议的那样：

当您的应用首次加载时，通常会有一组您知道您将需要的初始模型来呈现页面。与其触发额外的 AJAX 请求来获取它们，更好的模式是让它们的数据已经引导到页面中。

我认为我需要做的例子在ruby​​ 和 php 的骨干模式中给出，但我并没有将这些点与它在 java 中的工作方式完全联系起来。我是否需要使用诸如 mustache.java 之类的模板库并在页面提供之前对其进行预处理？有人能给我举个例子吗？

谢谢，马克

4

4 回答 4

1

我对 Jersey 不熟悉，但看了看文档，它似乎主要是一个 Restful Web Service 框架。看来您可以使用 @Produces 注释提供“text/html”的内容类型，但我没有看到使用模板系统呈现视图的明显方法。因此，您可能应该从 Java Web 框架（如Spring或Play Framework）开始，通过视图模板（如果您愿意，可以使用 Mustache）来提供包含引导数据集合的初始 HTML。您仍然可以使用 Jersey 来提供后续的 Ajax/Restful 调用，但 Spring 和 Play 也都内置了 Restful 概念。

于 2012-05-22T05:44:06.250 回答
1

是的，您需要某种形式的模板才能将动态数据与 HTML 页面的静态布局混合。但是，如果您只需要一个页面，您可能不想投资设置一个完整的模板方案。相反，您可以简单地将您的页面分成两部分并通过将第一部分放在您的 JSON 表示之后再放在第二部分来提供您的主页。这有点难看，但是否值得为这个单一案例添加模板取决于您。如果你选择使用模板，你可以使用 mustache 或者我建议使用Velocity Templates。

通读 Jersey 代码，看起来您将不得不显式调用Jackson以将自举模型对象从 Java 转换为 JSON。

于 2012-05-25T00:48:21.353 回答
1

解决方案因模板引擎而异。我不太了解 Moustache.java 来翻译这个 JSP 示例。使用 Jackson 进行 JSON 序列化，这将是 JSP 标记文件：

public class JsonTag extends SimpleTagSupport {

/** the instance to serialize as JSON JSON */
private Object value;

@Override
public void doTag() throws JspException, IOException {
    String json = new ObjectMapper().writeValueAsString(value);
    getJspContext().getOut().print(json);
}

public void setValue(Object value) {
    this.value = value;
}

}

还有你的 HTML 页面：

<script>
var router = new App.TabRouter({
    model: new App.MyModel(<k:json value="${it}"/>)
});
</script>

对于一个严肃的应用程序，您应该重用 ObjectMapper 实例，而不是每次都创建一个新实例。

于 2012-05-26T08:45:26.310 回答
-1

要引导您对数据建模，您只需要将模型 JSON 呈现到标签中。从主干模式链接释义：

<script>
  // app data, rendered on server
  var photosJSON = [
    { id: 2, name: "My dog", filename: "IMG_0392.jpg" },
    { id: 3, name: "Our house", filename: "IMG_0393.jpg" },
    { id: 4, name: "My favorite food", filename: "IMG_0394.jpg" },
    { id: 5, name: "His bag", filename: "IMG_0394.jpg" },
  ];
 </script>      
 ...

 <script>
  var Photo = Backbone.Model.extend({
  // photo attributes (from above)
  });

  var PhotoCollection = Backbone.Collection.extend({
     model:Photo
  });

  // build collection model without AJAX call using
  // server rendered JSON above
  var photosCollection = new Photos(photosJSON);
</script>

您可以在服务器上使用任何适当的技术来呈现带有 JSON 数据的脚本。

于 2012-05-22T05:01:32.093 回答