服务器如何将异步更改推送到 JSF 创建的 HTML 页面？

发布于 2024-10-24 08:28:33 字数 132 浏览 2 评论 0原文

当我们创建 JSF 页面时，客户端请求允许使用 Java 代码和 HTML 的组合动态生成 HTML。我们是否可以使用 JSF 框架在 HTML 页面中引入钩子，允许服务器根据稍后在服务器上发生的异步事件（通常通过不同的线程）更新 HTML 页面？

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

意中人 2024-10-31 08:28:33

JSF 2.3+

您可以使用 @Push 和为此。下面是一个带有应用范围套接字的启动示例，该套接字在后端通过 Event#fire() 其托管 bean @Observes。

<h:dataTable id="notifications" value="#{bean.notifications}" var="notification">
    <h:column>#{notification.message}</h:column>
</h:dataTable>

<h:form>
    <f:websocket channel="push">
        <f:ajax event="updateNotifications" render=":notifications" />
    </f:websocket>
</h:form>

@Named @ApplicationScoped
public class Bean {

    private List<Notification> notifications;

    @Inject
    private NotificationService service;

    @Inject @Push
    private PushContext push;

    @PostConstruct
    public void load() {
        notifications = service.list();
    }

    public void onNewNotification(@Observes Notification newNotification) {
        notifications.add(0, newNotification);
        push.send("updateNotifications");
    }

    public List<Notification> getNotifications() {
        return notifications;
    }

}

@Stateless
public class NotificationService {

    @Inject
    private EntityManager entityManager;

    @Inject
    private BeanManager beanManager;

    public void create(String message) {
        Notification newNotification = new Notification();
        newNotification.setMessage(message);
        entityManager.persist(newNotification);
        beanManager.getEvent().fire(newNotification);
    }

    public List<Notification> list() {
        return entityManager
            .createNamedQuery("Notification.list", Notification.class)
            .getResultList();
    }

}

JSF 2.2 -

如果您还没有使用 JSF 2.3，则需要使用第 3 方 JSF 库。

OmniFaces 具有 (JSR356 WebSocket + CDI)
PrimeFaces有 (Atmosphere)
ICEfaces 有“ICEpush”（长轮询）

应该注意的是是 JSF 2.3 的基础。因此，如果您发现了很多相似之处，那就是正确的。

PrimeFaces 在底层使用 Atmosphere （如果没有 Maven，设置起来很麻烦）。 Atmosphere 支持 Websocket，并可回退到 SSE 和长轮询。 ICEfaces 基于古老的长轮询技术。所有这些都没有实现本机 JSR356 WebSocket API，该 API 后来才在 Java EE 7 中引入。OmniFaces

使用本机 JSR356 WebSocket API（在所有 Java EE 7 服务器和 Tomcat 7.0.27+ 中受支持）。因此，它的设置和使用也是最简单的（一个 JAR、一个上下文参数、一个标签和一个注释）。它只需要 CDI（在 Tomcat 上安装并不难），但它甚至使您能够从非 JSF 工件（例如 @WebServlet）进行推送。出于安全性和 JSF 视图状态保持原因，它仅支持单向推送（服务器到客户端），而不支持相反的方式。为此，您可以继续以通常的方式使用 JSF ajax。 JSF 2.3 主要基于 OmniFaces ，因此您会发现它们的 API 有很多相似之处（JSF - OmniFaces）。

或者，您也可以使用轮询而不是推送。几乎每个支持 ajax 的 JSF 组件库都有一个组件，例如带有。这允许您每 X 秒向服务器发送一个 ajax 请求，并在必要时更新内容。只是效率比push低而已。

另请参阅：

JSF 2.3+

You can use @Push and <f:websocket> for this. Below is a kickoff example with an applicaiton scoped socket which updates a data table upon an event fired by the backend via Event#fire() which the managed bean @Observes.

<h:dataTable id="notifications" value="#{bean.notifications}" var="notification">
    <h:column>#{notification.message}</h:column>
</h:dataTable>

<h:form>
    <f:websocket channel="push">
        <f:ajax event="updateNotifications" render=":notifications" />
    </f:websocket>
</h:form>

@Named @ApplicationScoped
public class Bean {

    private List<Notification> notifications;

    @Inject
    private NotificationService service;

    @Inject @Push
    private PushContext push;

    @PostConstruct
    public void load() {
        notifications = service.list();
    }

    public void onNewNotification(@Observes Notification newNotification) {
        notifications.add(0, newNotification);
        push.send("updateNotifications");
    }

    public List<Notification> getNotifications() {
        return notifications;
    }

}

@Stateless
public class NotificationService {

    @Inject
    private EntityManager entityManager;

    @Inject
    private BeanManager beanManager;

    public void create(String message) {
        Notification newNotification = new Notification();
        newNotification.setMessage(message);
        entityManager.persist(newNotification);
        beanManager.getEvent().fire(newNotification);
    }

    public List<Notification> list() {
        return entityManager
            .createNamedQuery("Notification.list", Notification.class)
            .getResultList();
    }

}

JSF 2.2-

If you're not on JSF 2.3 yet, you need to head to 3rd party JSF libraries.

OmniFaces has <o:socket> (JSR356 WebSocket + CDI)
PrimeFaces had <p:socket> (Atmosphere)
ICEfaces had "ICEpush" (long polling)

Noted should be that the <o:socket> was the basis for the JSF 2.3 <f:websocket>. So if you have found a lot of similarities, then that's correct.

PrimeFaces uses Atmosphere under the hoods (which is troublesome to setup without Maven). Atmosphere supports websockets with fallback to SSE and long polling. ICEfaces is based on ancient long polling technique. All of those do not implement native JSR356 WebSocket API which was only later introduced in Java EE 7.

OmniFaces uses native JSR356 WebSocket API (supported in all Java EE 7 servers and Tomcat 7.0.27+). It is therefore also most simple to setup and use (one JAR, one context param, one tag and one annotation). It only requires CDI (not hard to install on Tomcat), but it enables you to even push from a non-JSF artifact on (e.g. a @WebServlet). For security and JSF view state keeping reasons, it only supports one-way push (server to client), not the other way round. For that you can keep using JSF ajax the usual way. The JSF 2.3 <f:websocket> is largely based on OmniFaces <o:socket>, hence you'll find a lot of similarities in their APIs (JSF - OmniFaces).

Alternatively, you can also use polling instead of pushing. Pretty much every ajax aware JSF component library has a <xxx:poll> component, such as PrimeFaces with <p:poll>. This allows you to send every X seconds an ajax request to the server and update the content whenever necessary. It's only less efficient than push.