When my website is hosted on a server, it becomes unresponsive, freezes, and crashes after a few minutes. However, everything works fine when I run it locally on localhost while pulling API data from a Flask Server app.
The Flask-based API engine retrieves JSON data every second, updating the Google Map marker based on the latitude and longitude received from the API.
My expectation is that the webpage should not freeze or become unresponsive.
var map_lat = 28.644800;
var map_lon = 77.216721;
var head = 0;
var ngUrl = "http://*******.com/";
function httpGet(theUrl) {
var xmlHttp = new XMLHttpRequest();
xmlHttp.open("GET", theUrl, false); // synchronous request
xmlHttp.send(null);
return xmlHttp.responseText;
}
function buttonFunctionPR(id) {
url = ngUrl.concat("x1/");
var response = httpGet(url + id);
response = JSON.parse(response);
document.getElementById("message").innerHTML = response['msg'];
}
// Asynchronous functions for continuous data retrieval and display
hcFunOne = async() => {
// Function content here...
}
hcFunTwo = async() => {
// Function content here...
}
hcFunThree = async() => {
// Function content here...
}
hcFunFour = async() => {
// Function content here...
}
hcFunFive = async() => {
// Function content here...
}
// Initiate asynchronous functions
setTimeout(function() {
hcFunOne();
hcFunTwo();
hcFunThree();
hcFunFour();
hcFunFive();
}, 500);
// Google Maps functionality
var map;
var markers = [];
function initMap() {
// Initialize map and markers
}
function addMarker(location) {
// Add marker to the map
}
function setMapOnAll(map) {
// Set map for all markers
}
initMap(); // Initializing the map