时间戳

首页 > 解决方案 > 读取文本文件，通过 PHP 回显它并每隔几秒用 JS 刷新它

javascript - 读取文本文件，通过 PHP 回显它并每隔几秒用 JS 刷新它

问题描述

我想为我的网站创建一个实时日志。PHP 脚本从 data/log.txt 获取内容并回显它。然后通过 JavaScript 每秒重复相同的过程。

我使用此代码对其进行测试，但有一些问题：

<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);                                                         
?>

PHP 片段本身效果很好。但我似乎无法让 JavaScript 部分工作......

问题 1：当我更改 log.txt 的内容时，JavaScript 部分不会像我预期的那样自行刷新。我是 JavaScript 的初学者，所以我可能犯了一些明显的错误，或者对我应该如何做有错误的想法。

问题2：

只要 log.txt 仅包含一行，输出就可以：

Javascript 刷新：test1

单独测试 PHP：test1

但是，一旦我添加了一个空行，JavaScript 部分就不会加载任何内容。

标签： javascriptphphtml

解决方案

在对我最初问题的评论的帮助下，我想出了以下代码，效果很好：

<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);                                                         
?>

推荐阅读