Read text file, echo it via PHP and refresh the it with JS every few seconds

Question

I want to create a real-time log for my website. A PHP script gets the content from data/log.txt and echoes it. Then the same process gets repeated every second via JavaScript.

I use this code to test it but have a few problems:

<html> <head> <title></title> <script type="text/javascript"> window.onload = startInterval(); function startInterval() { setInterval("loadLog();",1000); } function loadLog() { document.getElementById('log').innerHTML = "<?php $datei=fopen("data/log.txt","r"); while(!feof($datei)) { $zeile = fgets($datei,1000); echo $zeile."<br>"; } fclose($datei); ?>"; } </script> </head> <body> Javascript refresh:<br> <div id="log"></div> </body> </html> Testing PHP seperatly:<br> <?php $datei=fopen("data/log.txt","r"); while(!feof($datei)) { $zeile = fgets($datei,1000); echo $zeile."<br>"; } fclose($datei); ?>

The PHP snippet by itself works great. But I can't seem to get the JavaScript part to work...

Problem 1: When I change the content of log.txt the JavaScript part does not refresh itself as I would expect. I'm a beginner with JavaScript so I might have made some obvious mistakes or have a wrong idea how I should do it.

Problem 2:

As long as log.txt consist of only one line the output works:

Javascript refresh: test1

Testing PHP separately: test1

But as soon as I add an even empty line the JavaScript part doesn't load anything.

This link might help you. gomakethings.com/ajax-and-apis-with-vanilla-javascript — J. Langer
– J. Langer, Commented Feb 19, 2019 at 17:09
Possible duplicate of What is the difference between client-side and server-side programming? — ADyson
– ADyson, Commented Feb 19, 2019 at 17:10
How do I do that? Because adding this line: <script type="text/javascript" src="ajax.googleapis.com/ajax/libs/jquery/1.3.0/…> doesnt change anything? — Szeperator
– Szeperator, Commented Feb 19, 2019 at 17:11
the PHP does not re-execute every time you run your JS. the PHP has already executed on the server, it runs once to build your page, and then the result of the PHP is embedded into your page as static data. JavaScript runs in the browser once the page has loaded. It's a totally separate execution environment. You can't just mingle them together and expect it to work. If you do a "View Source" in your browser on your page you'll see that everything after document.getElementById('log').innerHTML = " is hard-coded - the result of the script than ran on your server to create your web page. — ADyson
– ADyson, Commented Feb 19, 2019 at 17:11

Szeperator · Accepted Answer · 2019-02-19 17:33:32Z

With the help of the comments on my initial question I came up with the following code wich works great:

<html> <head> <title></title> <script src="resources/javascript/jquery-3.3.1.min.js"></script> <script type="text/javascript"> setInterval(function(){ $('#log').load('loadlog.php'); }, 2000) /* time in milliseconds (ie 2 seconds)*/ </script> </head> <body> Javascript refresh:<br> <div id="log"></div> </body> </html> Testing PHP seperatly:<br> <?php $datei=fopen("data/log.txt","r"); while(!feof($datei)) { $zeile = fgets($datei,1000); echo $zeile."<br>"; } fclose($datei); ?>

Collectives™ on Stack Overflow

Read text file, echo it via PHP and refresh the it with JS every few seconds

1 Answer 1

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Linked

Related