MySQL get value realtime (w delay) by JavaScript (ajax). Encrypter code

Hello friends,

this topic is about getting a MySQL value in realtime (with delay) using JavaScript.

To work with change of values ​​in real time we can use:

  • CloudDB.
  • FirebaseDB (realtime).
  • MQTT.

Here we are going to see it with a MySQL database:

  • Data base name: web

  • Table name: sensores

  • We want to query the cell temperatura of the row id = 2

  • We have several methods:

  • Create an HTML page with PHP and refresh it with the classic:

<meta http-equiv ="refresh" content ="8" >

  • or with JavaScript:


With these two methods we would refresh the entire page.

  • We can also use a Clock timer and the Web component:


  • but we want to get the value refreshed by JavaScript.

1.- Code to insert temperatura in MySQL.

With this code we can insert a temperatura value in the row id = 2.


$link = new mysqli("localhost", "name_user", "password_user", "name_database");
if ($link->connect_error) {
    die('Connect Error: ' . $mysqli->connect_error);
        mysqli_query ($link, "UPDATE sensores SET temperatura='$tempera' WHERE id=2"); 
        echo "Saved: ".$tempera;
$link -> close(); 	

2.- Code to get the temperature value from MySQL.

By means of this code we can obtain the temperatura value of the row id = 2.


$link = new mysqli("localhost", "name_user", "password_user", "name_database");
if ($link->connect_error) {
    die('Connect Error: ' . $mysqli->connect_error);
$result = mysqli_query ($link, "SELECT temperatura FROM sensores WHERE id=2 ");
if (mysqli_num_rows($result) > 0) {
  while($row = mysqli_fetch_assoc($result)) {
	 $temp = $row["temperatura"];
 // echo $temp;
  echo json_encode($temp);
} else {
  echo "-";
$link -> close(); 	

3.- Designer

4.- Blocks.

  • When Click btn_send, we send the temperature value to MySQL and receive a response.

  • When Click btn_get, we get the value of the MySQL temperature.

  • I have used two Web components to facilitate the code.

5.- Download app.

p169Z_javascript_mysql.aia (2.8 KB)


- JavaScript (.ajax). Timer.


<script src=""></script>
<script type="text/javascript">
var auto_refresh = setInterval(function(){
      type: "POST",
      url: "get_tempe.php",  
      success: function(temper){    // temper is return value.
		window.AppInventor.setWebViewString("" + temper);
}, 8000); 	


<div id="hereTemper"></div>

This code acts as a timer using JavaScript and .ajax.

Every 8 seconds it calls get_tempe.php and gets the value in the "temper" variable.

That value is shown in
<div id="hereTemper"></div>
of the web page and

sent to the app through:

window.AppInventor.setWebViewString ("" + temper);

  • The btn_automatic, we only have to Click it once to start the code of auto_refresh.

  • The files post_tempe.php, get_tempe.php and automatico.htm must be uploaded to our server.

Note: this example has been tried to explain in a simple way, the reader can modify the code and establish better security methods.


- Encrypter HTML, JavaScript code.

This is not related to MySQL, but I think it is fine here.

  • We have a code in HTML, JavaScript and we want to encrypt it.

  • We are going to:

  • and we convert our text code to hexadecimal in ASCII.

It can be decrypted in a very simple way, it is just an idea.