Question

我正在一个包含2个独立页面的项目中：每个页面都显示在不同的计算机上。我希望每次单击第一页上的按钮时，都会刷新第二页。我该怎么办？

我已经尝试过通过每次单击按钮在数据库中存储数字（1）。在第二页中，如果数字为1，则将其清除为0，然后刷新。（PHP，jQuery）。

我认为AJAX存在一个答案，但我不知道该怎么做。

这是我的第二页（我要刷新）

<script type="text/javascript">
    setInterval("my_function();",10000); 

    function my_function()
    {
        $('.refresh').load(location.href + ' .refresh');
    }
</script>

    <div class="refresh">
        <?php 
            require("database.php");    
            $db = Database::connect();

            $statement = $db->query("SELECT * from refresh");
            $item = $statement->fetch();

            if ($item["value"] =="1")
            {                                   
                $newval = "0";
                $statement = $db->prepare("UPDATE refresh SET value=?");
                $statement->execute(array($newval));
                Database::disconnect();
                header("location: page2.php");
            }
        ?>  
    </div>

Answer 1

在setInterval上调用后端可能非常繁重。使用WebSocket来解决这些问题。您可以使用WebSockets以非常轻巧的方式实现所需的功能。

此用例的实现可能是（对于浏览器）：

var socket = io()

// Send refresh command
document.getElementByd('my-button').addEventListener('click', function () {
  socket.emit('refresh', '')
})

// Refresh when command comes
socket.on('refresh', function() {
  location.reload()
});

您还需要在后端设置SocketIO才能完成所有这些工作。结帐：http://socketo.me/docs/http

Answer 2

我认为最好的方法之一是使用实时数据库，该数据库与每个连接的客户端实时同步，并且您的页面会自动接收具有最新数据的更新。

这样，您可以有两个单独的页面，在两个不同的选项卡（或计算机）中打开，并且在其中一个选项卡中，您将在第二页中更新一些数据，并且它将自动更新并生效。

我个人喜欢Firebase实时数据库，并且对于打算使用的每个平台都有很好的文档。

从另一个页面刷新页面

2 个答案: