Home / Questions / 13003
Accepted
Lina Cortés
Asked: 2020-06-07 09:10:11 +0800 CST 2020-06-07 09:10:11 +0800 CST

Query database every X seconds

  • 772

What I need to do is the following, I don't know why but if a data is updated in the database it doesn't show it at once in my view, I have to run my project again to see the update of the data. I would like to make a method that checks the database every 5 seconds and updates the data I want.

I have been told that I can do it with f:ajax but I don't know how to use it, if you could give me an example to guide me I would greatly appreciate it.

The database is MySQL, I use JavaServerFaces and the connection is made through JPA.

java

3 Answers

  1. I give you an example of what the ajax code would look like:

    function ajax() {          

        var oReq = new XMLHttpRequest();
        oReq.open("POST", "tufuncionphp.php", true);

        oReq.onload = function (oEvent) {
            if (oReq.status == 200) {
                document.getElementById("divobjetivo").innerHTML = oReq.responseText;
            }
        };
        oReq.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        oReq.send(datos);
}

    I'll explain, for ajax to work, you always have to create an XMLHttpRequest type object.

    The essential thing is that in the.open object, you enter if it is a POST or GET type and the URL of your PHP.

    The object.onload function is executed when the PHP code has been executed. The .responseText method collects the PHP response text, and then you insert it wherever you want, in my example I leave it ready for you to put it in a field specified by an id. In the document.getElementById("divotarget"), change the divotarget to the id of your element where you want to reload the information.

    Finally, in object.send(), the fields that you want to send are passed to simulate sending a form to PHP, in the format "data1=data&data2=data2".

    If you want this to run every 5 seconds, you put the code in a setInterval, like so.

    function ajax() {          
setInterval(function(){
        var oReq = new XMLHttpRequest();
        oReq.open("POST", "tufuncionphp.php", true);

        oReq.onload = function (oEvent) {
            if (oReq.status == 200) {
                document.getElementById("divobjetivo").innerHTML = oReq.responseText;
            }
        };
        oReq.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        oReq.send(datos);

},5000);
}

    I hope I have explained myself well. All the best.

    • 2
  2. Best Answer

    The strategy explained in @PabloPéres-Aradros answer is a solution known as polling. That is, the client consults the server from time to time. You must use setIntervalfor a method to execute in a time interval. It happens that JSF, by default, places certain parameters in the client to ensure the state of the view and thus avoid CSRF attacks , so using the method that Pablo explains is not "so simple" when using JSF when doing everything manually. However, JSF does support polling.

    If you're using pure JSF, it would be best to delegate the action to a component with <f:ajax>:

    <h:form id="idForm">
    <!-- ... contenido ... -->
    <!-- Nota: el componente DEBE ser visible, sino no se ejecutará. -->
    <h:commandButton id="idBoton" action="#{bean.metodoParaRefrescar}">
        <f:ajax render="idComponenteARefrescar" />
    </h:commandButton>
    <!-- ... contenido ... -->
</h:form>

    And create a JavaScript function:

    setInterval(function() {
        document.getElementById("idForm:idBoton").click()
    }, 3000); //cada 3 segundos, adáptalo a tus necesidades

    If you use a library like PrimeFaces, consider that it already provides its own component to poll (code adapted from the PrimeFaces examples page ).

    <h:form id="idForm">
    <h:outputText id="txtContador" value="#{bean.numero}" />
    <!--
        Cada 3 segundos ejecutar una petición y ejecutar
        de lado del servidor el método declarado en listener
    -->
    <p:poll interval="3" listener="#{bean.incrementar}"
        update="txtContador" />
</h:form>

    Consider this as a simple example. Your server-side method can execute the necessary database calls. Also, you should measure the response time of the server and the refresh of the page to place the value of your interval.

    There is another strategy called push, which consists of the server executing the operations in time intervals and notifying the client that it must be updated. BalusC (Java and JSF guru) explains how to use push in JSF in this answer , partially translated:

    Until the new of JSF 2.3 <f:websocket>( issue 1396 ), the JSF standard library does not offer facilities for this. Needed to go to third-party libraries for now:

    The new JSF 2.3 component <f:websocket>is largely based on the <o:socket>.

    For your problem description, in my opinion, I would use polling. In any case, it is up to you to evaluate the alternatives and choose the most convenient one to use.

    • 2

  3. For that you have two options, one is that just a moment before your query returns the result of the command, a select command is executed where everything that has that table is called again. The other is the same way but using what with timers so that every so often the statement is executed again.

    • 0