Ajax Instant Messenger Using PHP


Ajax Instant Messenger Using PHP

正在为我的网站创建AJAX IM。。。当行插入mysql数据库时,需要加载页面的部分。。。有人能帮我吗。。提前感谢

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript">
var  waittime=2000;
var intUpdate = null;

function verifDB(){
$.ajax({
   type: "POST",
   url: "verifdb.php",
   success: function(msg){
    alert(msg),; 
   }
 });
intUpdate = setTimeout("verifDB()", waittime);
}
verifDB();
</script>

verifydb.php文件每2000毫秒查询一次,以检查数据库您可以将文件放在requette verifydb.php中您将在变量msg 中得到答案

客户端

对于客户端的非加密请求,您可以使用JQuery或纯Javascript XMLHTTPRequest

服务器端

我知道你已经指定了PHP,但我建议你检查一下谷歌频道是如何工作的,并在PHP中进行类似的实现。

由于检查让多个用户检查数据库上的更新,我建议您使用memcache。

类似于:

$script_called_time = time();
while($memcache->get('last_message') < $script_called_time){
    usleep(100);
}
$result = $database->query("SELECT * FROM `messages` WHERE `date` > " . $script_called_time . "'");
...

通过这种方式,连接将被建立,当有任何。。。

(function() {
  var chat = {
    messageToSend: "",
    messageResponses: [
      "I Love You",
      "I Wants to Kiss You.",
      'Hug Me!"',
      "Lets Sleep Together",
      "Lets go for a date",
      "Will you be physical with me?"
    ],
    init: function() {
      this.cacheDOM();
      this.bindEvents();
      this.render();
    },
    cacheDOM: function() {
      this.$chatHistory = $(".chat-history");
      this.$button = $("button");
      this.$textarea = $("#message-to-send");
      this.$chatHistoryList = this.$chatHistory.find("ul");
    },
    bindEvents: function() {
      this.$button.on("click", this.addMessage.bind(this));
      this.$textarea.on("keyup", this.addMessageEnter.bind(this));
    },
    render: function() {
      this.scrollToBottom();
      if (this.messageToSend.trim() !== "") {
        var template = Handlebars.compile($("#message-template").html());
        var context = {
          messageOutput: this.messageToSend,
          time: this.getCurrentTime()
        };
        this.$chatHistoryList.append(template(context));
        this.scrollToBottom();
        this.$textarea.val("");
        // responses
        var templateResponse = Handlebars.compile(
          $("#message-response-template").html()
        );
        var contextResponse = {
          response: this.getRandomItem(this.messageResponses),
          time: this.getCurrentTime()
        };
        setTimeout(
          function() {
            this.$chatHistoryList.append(templateResponse(contextResponse));
            this.scrollToBottom();
          }.bind(this),
          1500
        );
      }
    },
    addMessage: function() {
      this.messageToSend = this.$textarea.val();
      this.render();
    },
    addMessageEnter: function(event) {
      // enter was pressed
      if (event.keyCode === 13) {
        this.addMessage();
      }
    },
    scrollToBottom: function() {
      this.$chatHistory.scrollTop(this.$chatHistory[0].scrollHeight);
    },
    getCurrentTime: function() {
      return new Date()
        .toLocaleTimeString()
        .replace(/(['d]+:['d]{2})(:['d]{2})(.*)/, "$1$3");
    },
    getRandomItem: function(arr) {
      return arr[Math.floor(Math.random() * arr.length)];
    }
  };
  chat.init();
  var searchFilter = {
    options: { valueNames: ["name"] },
    init: function() {
      var userList = new List("people-list", this.options);
      var noItems = $('<li id="no-items-found">No items found</li>');
      userList.on("updated", function(list) {
        if (list.matchingItems.length === 0) {
          $(list.list).append(noItems);
        } else {
          noItems.detach();
        }
      });
    }
  };
  searchFilter.init();
})();

使用Jquery和PHP的Messenger如果你需要任何关于这个答案的帮助,请随时联系我,网址是pachauriashokkumar[at]gmail[dot]com,如果你需要带有css JS和HTML的完整代码,请给我发电子邮件,我会把代码发送给你

需要外部文件

  1. https://code.jquery.com/jquery-3.4.1.js
  2. https://cdn.jsdelivr.net/npm/handlebars@最新/dist/hullers.js
  3. https://raw.githubusercontent.com/javve/list.js/v1.5.0/dist/list.min.js

Messenger Using JQuery And PHP Demo Is Here This Post on PenCode的作者也可以通过电子邮件pachauriashokkumar[at]gmail[dot]com 进行澄清