0

我正在学习 JavaScript,但我希望尽快在我的小(自启动)项目中包含以下内容。

假设我网站的页面是www.mywebsite.com/myPage.html

这是 10 个用户myPage.html从我的网站查看的场景。当我从服务器(作为管理员)进行任何更改时myPage.html,我希望所有查看者myPage.html在我对myPage.html. 它应该非常快。

为此,我认为我必须创建一个刷新页面的按钮myPage.html。当我对 进行更改时myPage.html,我将按下该按钮,该按钮将重新加载每个查看者的浏览器页面 ( myPage.html)。他们将myPage.html在浏览器中看到修改的结果。

由于我是初学者,请正确解释您的答案。为此需要哪些语言?

4

3 回答 3

0

在客户端(浏览器)中的 socket.io 的情况下,使用特定通道订阅每个客户端,并在收到来自服务器通过该通道的请求时使用 javascript 重新加载页面。在服务器中,您可以在想要重新加载页面时向该特定频道广播消息。

于 2013-08-14T04:38:40.643 回答
0

您可以创建一个间隔执行的 AJAX 函数(例如每 10 秒),该函数将连接到服务器以请求来自 mysql 的任何更新,所以如果有任何更新!你通知用户。
因此,您应该在数据库中创建一个表,以便在更新页面时使用页面更新信息进行更新。

AJAX(asynchronous javascript and xml)是一种无需使用Forms即可连接到您的服务器的技术,您可以自动刷新部分页面。

现在这里是一个例子:
我想创建一个在线聊天,所以这里是代码:
这段代码使用 ajax 发布到 ChatNotifyController.php 以查看是否有人在线,如果有任何人它会通知用户。

//notify user if someone has or had send a message
setInterval(function(){

xmlhttp.open("POST" , "../controller/ChatNotifyController.php" , true);

xmlhttp.onreadystatechange = function()
{
     if (xmlhttp.readyState == 4)
     {
         if(xmlhttp.status == 200) 
         {
             if((xmlhttp.response).length > 4)
             {
                    var friendName = (xmlhttp.response).replace(/^\s*$[\n\r]{1,}/gm, '');
                    var responseArea = document.getElementById( friendName + 'ChatArea');

                    var x = friendName ;

                    if(x.indexOf('.') > 0)
                    {
                        x = x.replace('.', '\\.');
                    }

                    var link = $('#' + x);
                    var input = $('#' + x + 'ChatInput');
                    var e = jQuery.Event("keydown");
                    e.which = 13;

                    if(link.length > 0)
                    {
                        link.click();
                        input.trigger(e);
                    }
                    else
                    {                           
                        var html = "<li><a class=\"onlineUserLink\" id=\"" + friendName + "\" onclick=\"chat(" + "'" + friendName + "'"  + ")\" >" + friendName + "</a></li>";   
                        html += "<div class=\"chatDialog\" title=\"'" + friendName + "\"' id=\"'" +  friendName + 'ChatDialog' + "'\">";
                        html += "<div class=\"chatArea\"" +  " id=\"'" +  friendName + "ChatArea" + "'\">" + "</div>";                                          
                        html += "<input class=\"chatInput\"" + " id=\"'" +  friendName + 'ChatInput' + "'\" size=\"21\"  onkeydown=\"chatController(event , '" +  friendName + "' , '" +  window.user + "')>" + "</div>";

                        window.onlineArea.innerHTML += html;

                        var THIS = $('#' + x  + 'ChatDialog');
                        $(function() {      
                            THIS.dialog({
                                stack: false
                            });
                        });

                        link.click();
                        input.trigger(e);
                    }
             }
         }
         else 
         {
            //alert("Error during AJAX call. Please try again #003");
         }
     }
};
xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xmlhttp.send("user=" + window.user);

} ,5000);
于 2013-08-14T04:44:41.773 回答
0

我认为这里最好的选择是某种推送实现/网络套接字......这里有一些链接可以让你朝着正确的方向开始......

Websockets:使用现代 HTML5 技术进行真正的服务器推送

使用服务器发送事件向浏览器推送通知

于 2013-08-14T04:34:58.893 回答