服务器之家

服务器之家 > 正文

php网页版聊天软件实现代码

时间:2021-02-23 15:39     来源/作者:元木偶

本文实例为大家分享了php匿名聊天室的具体实现代码,供大家参考,具体内容如下

1. index.html   

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
<html>
 <head>
  <title>聊天室</title>
  <meta charset="utf-8"/>
  <link href="http://libs.baidu.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
  <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
  <script src="http://libs.baidu.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
  <link href="./css/style.css" rel="stylesheet"/>
  <script>
   var maxid = 0;
   function showmessage() {
    //创建ajax对象
    var xhr = new XMLHttpRequest();
    //监听
    xhr.onreadystatechange = function () {
     if (xhr.readyState === 4) {
      eval("var info=" + xhr.responseText);
      var text = "";
      for (var i = 0; i < info.length; i++)
      {
       text += "<div class='alert alert-success'>" +
         "<span class='name'>" + info[i].send + ":</span>" +
         "<span class='message'>" + info[i].content + "</span>" +
         "<span>(" + info[i].time + ")</span>" +
         "</div>";
       maxid = info[i].id;
      }
 
      var old = document.getElementById("msg").innerHTML;
      document.getElementById("msg").innerHTML = old + text;
      document.getElementById("msg").scrollTop = document.getElementById("msg").scrollHeight;
     }
    };
    //初始化
    xhr.open("get", "./action.php?maxid=" + maxid);
    //发送
    xhr.send();
   }
 
   $(document).ready(
     function ()
     {
      showmessage()
      self.setInterval("showmessage()", 2000);
     }
   );
   function send() {
    var postData ="content="+document.getElementById('content').value;
    var xhr = new XMLHttpRequest();
    xhr.open("POST", "./add.php", true);
    //一定要写头信息不然服务器接收不到
    xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    xhr.onreadystatechange = function () {
     var XMLHttpReq = xhr;
     if (XMLHttpReq.readyState == 4) {
      if (XMLHttpReq.status == 200) {
       document.getElementById('content').value="";
      }
     }
    };
    xhr.send(postData);
   }
  </script>
 </head>
 <body>
 
  <div class="panel panel-default" id="main">
   <!--聊天室名字-->
   <div class="panel-heading">
    <h3 class="panel-title">
     匿名者聊天室
    </h3>
   </div>
   <!--聊天室名字-->
   <!--聊天室消息框-->
   <div class="panel-body ">
    <div class="well no-bottom ">
     <!--     消息框样式-->
     <!--
     <div class="alert alert-success">成功!很好地完成了提交。</div>
     <div class="alert alert-info">信息!请注意这个信息。</div>
     <div class="alert alert-warning">警告!请不要提交。</div>
     <div class="alert alert-danger">错误!请进行一些更改。</div>
     -->
     <div id="msg" class="showmessage">
     </div>
     <!--聊天室消息框-->
     <div class="well" >
      <form role="form">
       <div class="form-group">
        <label for="name">发送消息</label>
        <textarea class="form-control" id="content" name="content"
           style="resize: none;font-family: Microsoft YaHei;" rows="3" >
        </textarea>
       </div>
       <div style="text-align: right">
        <button type="button" class="btn btn-primary" onclick="send()">
         <span class="glyphicon glyphicon-envelope"></span>
         发送
        </button>
       </div>
      </form>
     </div>
     <!--聊天室发送框-->
    </div>
   </div>
  </div>
 </body>
</html>

2. action.php

?
1
2
3
4
5
6
7
8
9
10
11
12
13
<?php
 
$link = mysqli_connect('localhost', 'root', '123', 'test');
mysqli_query($link, 'set names utf8');
$info= array();
header("Content-type: text/html; charset=utf-8");
$id=$_GET['maxid'];
$data = mysqli_query($link, "select * from talk where id>$id");
while ($array = mysqli_fetch_assoc($data)) {
 $info[] = $array;
};
 
 echo json_encode($info);

3. chat.sql

?
1
2
3
4
5
6
7
8
9
DROP TABLE IF EXISTS `talk`;
CREATE TABLE `talk` (
 `id` int(10) unsigned NOT NULL AUTO_INCREMENT COMMENT 'id',
 `send` varchar(10) CHARACTER SET utf8 DEFAULT NULL COMMENT '发送者昵称',
 `ip` varchar(12) CHARACTER SET utf8 DEFAULT NULL,
 `content` varchar(500) CHARACTER SET utf8 DEFAULT NULL,
 `time` varchar(50) DEFAULT NULL,
 PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=52 DEFAULT CHARSET=utf8;

4. add.php

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<?php
 
/**
 * @功能 将表单插入数据库
 */
$content=$_POST['content'];
print_r($_POST);
$time= date("Y-m-d H:i:s", time(0));
$link = mysqli_connect('localhost', 'root', '123', 'test');
mysqli_query($link, 'set names utf8');
$ip = $_SERVER["REMOTE_ADDR"];
$sql="INSERT INTO talk VALUES(NULL,'匿名者','$ip','$content','$time')";
$data = mysqli_query($link,$sql);
echo "$content";
if($data)
 echo "1";
 else
  echo "0";

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持服务器之家。

相关文章

热门资讯

2020微信伤感网名听哭了 让对方看到心疼的伤感网名大全
2020微信伤感网名听哭了 让对方看到心疼的伤感网名大全 2019-12-26
yue是什么意思 网络流行语yue了是什么梗
yue是什么意思 网络流行语yue了是什么梗 2020-10-11
Intellij idea2020永久破解,亲测可用!!!
Intellij idea2020永久破解,亲测可用!!! 2020-07-29
背刺什么意思 网络词语背刺是什么梗
背刺什么意思 网络词语背刺是什么梗 2020-05-22
苹果12mini价格表官网报价 iPhone12mini全版本价格汇总
苹果12mini价格表官网报价 iPhone12mini全版本价格汇总 2020-11-13
返回顶部