【问题标题】:chat box working ? is this the right way?聊天框工作?这是正确的方法吗?
【发布时间】:2011-10-17 12:20:45
【问题描述】:

我想创建一个聊天框,我在互联网上找到了一些 sn-ps,但它们看起来太大而无法理解。在阅读了所有这些内容后,我有一个基本的方法来处理它:

  1. 在 mysql 中创建包含用户名、消息和时间戳等列的表。
  2. 使用 AJAX 并让 user1 将消息发布到数据库中而无需刷新。
  3. 让 user2 从数据库中检索消息。

我是 AJAX 和网页设计的初学者,老实说,我只知道使用 AJAX 获取数据和发布数据,但我的问题是:当某些用户发布内容时,我如何更新聊天框?

我知道如何在用户点击发送按钮时发布消息,但如何在不点击任何按钮的情况下将消息更新给其他用户?

有没有办法检测像post_event 这样用户将数据发布到数据库中的事件,以便我们可以在用户发布内容时执行一些操作?

据我们所知,我们在 JavaScript 中有很多事件,请帮我解决这些问题。

我一直在使用 AJAX,这是一种好习惯还是坏习惯?我的一个朋友说在网站上运行聊天框应用程序的成本比普通网站要高,这是真的吗?如果一个网站有一个聊天应用程序,它的成本是否会更高,即使它的流量更少?

【问题讨论】:

    标签: html ajax chat


    【解决方案1】:

    最简单的方法:

    要更新您的聊天窗口,您必须将请求传递给服务器(使用 Ajax),并将接收到的数据发布到某个文本区域(例如,使用 id “TextAreaId”):

    <script type="text/javascript">
    function updateChat() {
                 $.ajax({
                      url: "your_url",
                      type: "POST",
                      success: function (data) {
                           $("#TextAreaId").value = data;              
                      }
                  });
    }
    </script>
    

    服务器端应该返回一些消息(例如最后 20 条)。

    要在一段时间内更新您的聊天窗口,您可以使用:

    <body onload="setInterval('updateChat()', 1000)">
    

    发布一些消息它 ajax 到:

    <script type="text/javascript">
    function postMessage() {
                 $.ajax({
                      url: "your_url",
                      type: "POST",
                      data: "message = " + Message + "&user = " + User, // pass message and user name
                      success: function (data) {
                           updateChat();   
                      }
                  });
    }
    </script>
    

    并使用 PHP 或 ASP 在服务器端处理您的 ajax 请求。


    我认为最好使用一些文本文件而不是数据库。它减少了服务器负载。

    There你可以找到可以帮助你从服务器Ajax.Request获得响应的机制

    Here你可以找到聊天的例子。

    Here 我找到的最简单的例子。

    【讨论】:

      【解决方案2】:

      你需要一个计时器

          this.ajaxError(function (event, request, settings) {
              //code to set timer
          });
      

      那么你需要一个 jquery 函数来检索自上次更新以来的所有消息

              getMessages = function () {
      
              clearTimer();
              var postData = getPostData();
              postData.ChatMessage = '';
      
              $.post(url, postData, applyData, settings.dataType);
          }
      

      其中 PostData 是 lastupdated、聊天室 id 等变量。

      【讨论】:

        猜你喜欢
        • 2019-09-22
        • 1970-01-01
        • 2013-09-25
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2021-12-10
        • 2021-05-16
        相关资源
        最近更新 更多