Как мне запросить переменную с веб-сервера, используя AJAX?
У меня есть цикл в моем JavaScript, который постоянно проверяет переменную EventCounter
, если eventcounter равен нулю, он продолжает выполнять действие, затем увеличивает его ++, и затем он продолжает ничего не делать, пока эта переменная не изменится, вот код:
EventCounter = {{eg.globals.EventCounter}};
for(var i = 0; i < n; ++i) {
r = rects[i];
ctx.strokeRect((r.x*sc)|0,(r.y*sc)|0,(r.width*sc)|0,(r.height*sc)|0);
window.rects = rects[i];
//console.log(EventCounter);
if (EventCounter === 0) {
console.log("event counter is" + EventCounter)
//setTimeout( function () {document.getElementById("sb").click()}, 5000)
EventCounter++
console.log("event counter is now " + EventCounter);
}
}
}
Теперь глобальная переменная EventCounter получает свое значение от веб-сервера (это веб-сервер Python и его переменная Python).
Но мой вопрос: как я могу определить, что переменная изменилась на веб-сервере? запрос ajax правильно? Как мне поступить с запросом значения переменной, чтобы определить, изменилось ли оно, чтобы цикл мог работать снова? (** сервер несовместим с PHP)
3 ответа
Вы можете использовать WebSockets, как советует Майк В.
Также вы можете написать скрипт на вашем сервере python, который возвращает JSON при его вызове, а затем иметь нужные вам переменные и их значения в файле JSON. Это будет поддерживаться для всех браузеров, а не только для современных, как того требуют WebSockets.
Вот реализация jQuery, которая опрашивает серверный скрипт каждые 1000 мс и отображает результат. Ваше типичное время ответа + время обработки в браузере должно быть значительно меньше, чем интервал опроса, иначе ваши запросы могут быть сохранены.
Javascript:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>eventCounter</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script type="text/javascript">
var interval = setInterval(function() {
// this is where your ajax call is made.
$.ajax('geteventcounter.php', {
cache: false,
dataType:'json',
success: function(data) {
// do your browser-side processing here.
$('#eventCounter').text(data.eventcounter);
}
});
}, 1000);
</script>
</head>
<body>
<p>eventCounter is <span id=eventCounter></span></p>
</body>
</html>
PHP на стороне сервера: в этом примере используется переменная сеанса, которая увеличивается на каждый запрос и возвращает строку JSON.
<?php
session_start();
// initialise counter, or increment it.
if (isset($_SESSION['eventcounter'])) {
$_SESSION['eventcounter']++;
} else {
$_SESSION['eventcounter'] = 0;
}
// set output mime type
header("ContentType: application/json");
// copy session variable to a new array, convert to JSON and send.
echo json_encode(['eventcounter' => $_SESSION['eventcounter']]);
?>
Взгляните на WebSockets, которые позволяют серверу отправлять сообщение в браузер, когда он этого хочет, после установления соединения. Вы обрабатываете входящее сообщение с помощью обработчика событий Javascript, что позволяет избежать необходимости непрерывного опроса.
WebSockets поддерживаются всеми основными браузерами, включая IE10. Конечно, вы должны убедиться, что ваше серверное приложение также может поддерживать WebSockets.