Le composant
idleMonitor
, surveille l’action de l’utilisateur et se déclenche lorsque l’utilisateur redevient inactif ou actif. Par défaut, la durée d’inactivité est définie sur 5 minutes (300 000 ms) et vous pouvez personnaliser la durée via l’attribut timeout comme ci-dessous:
<!-- fire if user idle for 10 seconds --> <p:idleMonitor timeout="10000" onidle="idleDialog.show()"/>
Dans ce tutoriel, nous allons vous montrer un exemple
idleMonitor
, une boîte de dialogue de confirmation si l’utilisateur est inactif pendant 10 secondes. En fait, cet exemple est inspiré du site Web de ma banque. Il me demande toujours si je souhaite continuer après une pause de 5 minutes.
Les outils utilisés :
-
PrimeFaces 3.3
-
JSF 2.2.11
-
Eclipse 4.2
-
Maven 3
-
Tomcat 7
1. Composant idleMonitor
Si l’utilisateur reste inactif pendant 10 secondes, une boîte de dialogue de confirmation s’affiche pour lui demander si l’utilisateur souhaite continuer ou s’il est déconnecté.
-
Si oui, fermez la boîte de dialogue de confirmation et affichez un message de bienvenue
message via le composant
growl
.
-
Si l’utilisateur choisit de se déconnecter, fermez également la boîte de dialogue de confirmation et affichez un message.
message de déconnexion via le composant
growl
.
index.xhtml
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:p="http://primefaces.org/ui"> <h:head> </h:head> <h:body> <h1>PrimeFaces idleMonitor example</h1> <h:form> <p:growl id="msg" showDetail="true" sticky="true"/> <!-- If idle 10 seconds, run 'idleDialog' --> <p:idleMonitor timeout="10000" onidle="idleDialog.show()"/> <p:confirmDialog id="confirmDialog" message="You have been idle for at least 10 seconds, Please click ok to continue." header="Are you there?" severity="alert" widgetVar="idleDialog"> <p:commandButton id="confirm" value="Ok" update="msg" oncomplete="idleDialog.hide()" actionListener="#{idleBean.welcomeListener}"/> <p:commandButton id="Logout" value="LogMeOut" update="msg" oncomplete="idleDialog.hide()" actionListener="#{idleBean.logoutListener}"/> </p:confirmDialog> </h:form> </h:body> </html>
2. ManagedBean
Fournit un message sur les faces pour le composant
growl
.
IdleMonitorBean.java
package com.mkyong; import javax.faces.application.FacesMessage; import javax.faces.bean.ManagedBean; import javax.faces.context.FacesContext; @ManagedBean(name = "idleBean") public class IdleMonitorBean { public void welcomeListener() { FacesContext.getCurrentInstance().addMessage( null, new FacesMessage(FacesMessage.SEVERITY__WARN, "Welcome Back", "Continue your works.")); } public void logoutListener() { FacesContext.getCurrentInstance().addMessage( null, new FacesMessage(FacesMessage.SEVERITY__WARN, "You Have Logged Out!", "Thank you for using abc Online Financial Services")); //invalidate session, and redirect to other pages } }
Télécharger le code source
Téléchargez-le - lien://wp-content/uploads/2012/08/primefaces-IdleMonitor-example.zip[primefaces-IdleMonitor-example.zip](11 Ko)
Références
cas d’exposition idleMonitor]