CODEWITHSUNDEEP
javascriptjqueryhtmlajaxapi
Ryan Duffing
Ryan Duffing

Reputation: 674

Site redirects to index.php after being open while making calls to an API using AJAX

I have built out a site that is constantly refreshing data using an AJAX call to an external API. The AJAX call uses JSONP to grab a JSON string of data due to the cross-domain restrictions involved with browsers.

The site's function is to stay open on a bigger monitor so that our help desk can be notified about how many tickets are in their queues. The site works fine some some undetermined amount of time, usually between 30 minutes to an hour. But for some odd reason it breaks and tries to redirect to "index.php", which doesn't exist. I'm not sure what is causing this.

I have relevant code below. I've spent some time in narrowing it down to that specific javascript function. I have spent some time on Google looking for answers, but have come up empty.

Perhaps someone has some insight into what is happening? Or does anyone know of any good website monitoring tools I can use to observe what is happening?

To add, the "token" part of my AJAX call is valid in my site, but I just cleared it out here for security purposes.

HTML

<!DOCTYPE html>
<html>
<head>
    <title>WALLBOARD</title>
    <link href="Content/style.css" type="text/css" rel="stylesheet">

    <script src="Scripts/jquery-1.9.1.min.js" type="text/javascript"></script>
    <script src="Scripts/wallboard.js" type="text/javascript"></script>
</head>
<body>
    <div id="div_hardware" class="div_normal span6">
        <h1>Hardware</h1>
        <div id="span_hardwareTickets">-</div>
    </div>
    <div id="div_atschool" class="div_normal span6">
        <h1>AtSchool</h1>
        <div id="span_atschoolTickets">-</div>
    </div>
    <div id="div_network" class="div_normal span3">
        <h1>Network</h1>
        <div id="span_networkTickets">-</div>
    </div>
    <div id="div_software" class="div_normal span3">
        <h1>Software</h1>
        <div id="span_softwareTickets">-</div>
    </div>
    <div id="div_openTickets" class="span3 div_normal">
        <h1>Open Tickets</h1>
        <div id="span_openTickets">-</div>
    </div>
    <div id="div_newTickets" class="span3 div_normal">
        <h1>New Tickets</h1>
        <div id="span_newTickets">-</div>
    </div>
    <script>
        grabParature();
    </script>
</body>

JAVASCRIPT

function grabParature() {
var url = "https://s3.parature.com/api/v1/5406/5426/Ticket";

$.ajax({
    url: url,
    type: "GET",
    dataType: "jsonp",
    cache: true,
    jsonp : "_callback_",
    jsonpCallback: "theData",
    data: {
        "_status_type_": "open",
        "_pageSize_" : "500",
        "_output_" : "javascript",
        "_token_" : "##################################"
    },
    success: function (results) {
        var openTickets = 0;
        var newTickets = 0;
        var atschoolTickets = 0;
        var hardwareTickets = 0;
        var softwareTickets = 0;
        var networkTickets = 0;

        for(var i = 0; i < results.Entities.Ticket.length; i++)
        {
            var queue = "";
            var status = results.Entities.Ticket[i].Ticket_Status.Status.Name["#text"];

            if (results.Entities.Ticket[i].Ticket_Queue != undefined) {
                queue = results.Entities.Ticket[i].Ticket_Queue.Queue.Name["#text"];
            }

            if (status === "Open") {
                openTickets++;
            }
            else if (status === "New") {
                newTickets++;
            }

            if (queue === "Hardware") {
                hardwareTickets++;
            }
            else if (queue === "Atschool") {
                atschoolTickets++;
            }
            else if (queue === "Network") {
                networkTickets++;
            }
            else if (queue === "Software") {
                softwareTickets++;
            }
        }
        $('#span_openTickets').html(openTickets);
        $('#span_newTickets').html(newTickets);
        $('#span_hardwareTickets').html(hardwareTickets);
        $('#span_atschoolTickets').html(atschoolTickets);
        $('#span_networkTickets').html(networkTickets);
        $('#span_softwareTickets').html(softwareTickets);

        setInterval(grabParature, 10000);
    }
});

};

EDIT

I changed setInterval(grabParature, 10000), to setTimeout(grabParature, 10000) as per Ryan Wheale's suggestion. I still get a redirect to index.php.

Upvotes: 1

Views: 164

Answers (1)

Ryan Wheale
Ryan Wheale

Reputation: 28410

Try not setting an interval. You should only have to setTimeout(). The interval would eventually stack up a bunch of these calls so that after about 30 minutes I can see you running out of memory as you would have about 180 ajax calls going out at the same time. Not sure why the redirect is happening - I would expect the browser to freeze... hard to tell without testing out.

Upvotes: 4

Related Questions