O
O
oc1tane2018-02-01 15:35:34
Arduino
oc1tane, 2018-02-01 15:35:34

Arduino and ajax?

Good afternoon, I need the help of specialists, I can’t understand the principle by which data is exchanged using AJAX.
I understand how GET works, but I can't understand Ajax for the life of me... Please explain how the technology works.
I have a working example of receiving data from DS18B20 sensors, approximately I understand that the client (website) sends a request to the server if there is a part of the code in the GET request, then the function is executed:
A piece of the receiving code from client.read();
("GET /temp") != 0) { getTemp(client); }
GetTemp function output

void getTemp(EthernetClient client) {
    sensors.requestTemperatures();
    client.print(sensors.getTempCByIndex(0));
}

js client side
<script>
function getTemp() {
nocache = "&nocache="  + Math.random() * 1000000;
var request = new XMLHttpRequest();
request.onreadystatechange = function() {
if (this.readyState == 4) {
if (this.status == 200) {
if (this.responseText != null) {
document.getElementById("switch_txt").innerHTML = this.responseText;
}}}}
request.open("GET", "temp" + nocache, true);
request.send(null);
setTimeout('getTemp()', 1000);
}
</script>

Here is an example for receiving data and displaying it, for example, in the form of text:
<div id="switch_txt">00.00</div>
But what if you need to process several requests, for example
1. Button click control
2. A set of text values?

Answer the question

In order to leave comments, you need to log in

1 answer(s)
K
kn0ckn0ck, 2018-02-01
@kn0ckn0ck

AJAX is from the word "asynchronous".
In one place in the code there is a request:

request.open("GET", "temp" + nocache, true);
request.send(null);

elsewhere in the code the response is processed:
request.onreadystatechange = function() {
if (this.readyState == 4) { // тут и ниже просто проверка статусов, они разные могут быть
if (this.status == 200) {
if (this.responseText != null) {
// здесь ответ от сервера подставляется в HTML
document.getElementById("switch_txt").innerHTML = this.responseText;
}}}}

what is unclear here? In general, this whole story is from Web technologies, in order to understand what the HTTP protocol is, requests, how they are processed and why AJAX is here, see introductory materials on Web development.

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question