long polling with ajax/jquery/php [closed]_问答_开发者

long polling with ajax/jquery/php [closed]

开发者 https://www.devze.com 2023-03-07 07:27 出处：网络

It's difficult to tell what is being asked here. This question is ambiguous, vague, incomplete, overly broad, or rhetorical andcannot be reasonably answered in its current form. For help clari

It's difficult to tell what is being asked here. This question is ambiguous, vague, incomplete, overly broad, or rhetorical and cannot be reasonably answered in its current form. For help clarifying this question so that it can be reopened, visit the help center. Closed 11 years ago.

I have found a lot of information how long polling works

Comet tutorial: http://www.screenr.com/SNH
A thred in stackoverflow: simple Long polling example

And more..

So I tried to make one of my own, but I can't get grasp the backend of it, the php part.

Heres is my html/jquery/ajax:

<!DOCTYPE html>
<html>
<head>
    <title>Arduino event poller</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js" type="text/javascript" charset="utf-8"></script>
    
    <style type = "text/css" me开发者_Python百科dia="screen">
        body{ font:13px/1.5 "helvetica neue", helvetica, arial, san-serif; background:#FFF; }
        #main{ width:430px; height: 300px; display:block; padding:10px 0; float: left; overflow: auto;}
        .event { display:block; background: #ececec; width:380px; padding:10px; margin:10px; overflow:hidden; text-align: left; }  
        .event img { display:block; float:left; margin-right:10px; }  
        .event p { font-weight: bold; }
        .event img + p { display:inline; }
        .patient-name { display:inline; color: #999999; font-size: 9px; line-height:inherit; padding-left: 5px; }
        .event-text{ color: #999999; font-size: 12px; padding-left: 5px; }
        .event-timestamp{ color: #000; padding-left: 5px; font-size: 9px;}
    </style>
    
    <script type="text/javascript" charset="utf-8">
        /* Simple helper to add some divs.*/
        function addevents(patientroom, patientname, eventtyp, timestamp)
        {
            $("#main").append(
                "<div class='event'>"
                "<p>" + patientroom + "</p>"
                "<p class='patient-name'>" + patientname + "</p>"
                "<p class='event-text'>" + eventtyp + "</p>"
                "<p class='event-timestamp'>" + timestamp + "</p>"
                "</div>"
                );
        }
        
        /*This requests the url "getevents.php" When it complete*/
        function waitForEvents()
        {
            $.ajax({
                type: "GET",
                url: "getevents.php",
                
                async: true, /* If set to non-async, browser shows page as "Loading.."*/
                cache: false,
                timeout:50000, /* Timeout in ms */
                
                success: function(patientroom, patientname, eventtyp, timestamp) /* called when request to getevents.php completes */
                {
                    addevents(patientroom, patientname, eventtyp, timestamp);
                    setTimeout(
                        'waitForEvents()', /* Request next event */
                         1000 /* ..after 1 seconds */                   
                        );
                    },
                error: function (XMLHttpRequest, textStatus, errorThrown){
                    alert("Error:" + textStatus + " (" + errorThrown + ")");
                    setTimeout(
                        'waitForEvents()', /* Try again after.. */
                        "15000"); /* milliseconds (15seconds) */        
                },
            });
        };
        
        $(document).ready(function(){
                waitForEvents(); /* Start the inital request */
        });
    </script>
</head>
<body>
    <div id="main">
    </div>
</body>
</html>

Here is the regular "backend" php part that I have written:

<?php
//row loop
    $con = mysql_connect("localhost","something","something");
        if(!con)
        {
            die('Could not connect: ' . mysql_error());
        }
        
        mysql_select_db("arduino_db",$con);

        $result = mysql_query("SELECT * FROM events ORDER BY eventID DESC");
        //Start container
        while($row = mysql_fetch_array($result))
        {
            echo "<div class='event'>";
            echo "<img src='img/ev_img/red.jpg' alt='picture' />";
            echo "<p>" . $row['rumNr'] . "</p>";
            echo "<p class='patient-name'>" . $row['inneboendeNamn'] . "</p>";
            echo "<p class='event-text'>" . $row['handelse'] . "</p>";
            echo "<p class='event-timestamp'>" . $row['tid'] . "</p>";
            echo "</div>";
        }
        mysql_close($con);
   ?>

Any tips or ideas? The example doesn't have to be scaleable, secure or complete, it just needs to work!