HTML脚本不断为每个用户同步

Question

我有以下代码。它是绿色图像（默认情况下），当任何人单击该图像时，它开始闪烁，然后第二次单击，它变为红色图片。是否可以为网站上的每个用户（实时）同步它。这样每个人都可以同时看到相同的内容，如果有人单击它，每个人都会闪烁吗？

<img id="red" src="green.gif" />
<script>
    var tId4, images4 = [],
    isBlinking4 = false;
    currImg4 = 0,

    images4[0] = new Image(); images4[0].src = "green.gif";
    images4[1] = new Image(); images4[1].src = "red.gif";
    images4[2] = new Image(); images4[2].src = "blinking3.gif";

        var img4 = document.getElementById("red");

        img4.onclick = function () {
            if (isBlinking4) {
                clearInterval(tId4);
                isBlinking4 = false;
                currImg4 = currImg4 == 0 ? 1 : 0;
                img4.src = images4[currImg4].src;

            } else {
                isBlinking4 = true;
                tId4 = setInterval(function () {
                    var src4 = document.getElementById("red").src;
                    // blink
                    document.getElementById("red").src = src4 == images4[currImg4].src ? images4[2].src : images4[currImg4].src;
                }, 700);
            }

        }
</script>

Answer 1

您需要设置一个后端服务器，以便查看HTML / Javascript前端的人可以根据client-server model向其发送更新并在发生某些更改时接收通知。 / p>

我个人可以使用WebSockets来实现，也许可以通过Ruby on Rails的ActionCable功能来实现。