php聊天室

前端页面

chat_room.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="shortcut icon" href="../ico/index.ico" />
    <title>聊天室</title>
    <style>
        div {
            width: 32rem;
            yellowgreen;
        }
    </style>
</head>
<body>
    <script>
        document.write(new Date());
    </script>
    <div id="con">
    </div>
    <form action="" method="">
        <input type="text" name="uname" id="uname" size="10">
        <input type="text" size="40" id="content">
        <input type="button" value="发送" id="btn" onclick="demo02()">
    </form>
    <script>
        function createXmlHttpRequest() {
            var request = false;
            request = new XMLHttpRequest();//尝试创建 XMLHttpRequest 对象，除 IE 外的浏览器都支持这个方法。
            if (request == false) {
                request = ActiveXobject("Msxml12.XMLHTTP");//使用较新版本的 IE 创建 IE 兼容的对象（Msxml2.XMLHTTP）。
            } else if (request == false) {
                request = ActiveXobject("Microsoft.XMLHTTP");//使用较老版本的 IE 创建 IE 兼容的对象（Microsoft.XMLHTTP）。
            } else if (request == false) {
                //alert("创建request失败！");
            } else {
                //alert("创建成功！")
            }
        }
        function demo02() {
            var request = false;
            request = new XMLHttpRequest();//尝试创建 XMLHttpRequest 对象，除 IE 外的浏览器都支持这个方法。
            if (request == false) {
                request = ActiveXobject("Msxml12.XMLHTTP");//使用较新版本的 IE 创建 IE 兼容的对象（Msxml2.XMLHTTP）。
            } else if (request == false) {
                request = ActiveXobject("Microsoft.XMLHTTP");//使用较老版本的 IE 创建 IE 兼容的对象（Microsoft.XMLHTTP）。
            } else if (request == false) {
                //alert("创建request失败！");
            } else {
                //alert("创建成功！")
            }
            var unameobj = document.getElementById("uname");
            var uname = unameobj.value;
            var contentobj = document.getElementById("content");
            var content = contentobj.value
            contentobj.value = '';
            var mess = "username=" + uname + "&" + "content=" + content;
            // alert(mess);
            request.open("POST", "php/write.php", true);
            request.setRequestHeader("Content-type", 'application/x-www-form-urlencoded');
            request.send(mess);
        }
        function getMass() {
            var request = false;
            request = new XMLHttpRequest();//尝试创建 XMLHttpRequest 对象，除 IE 外的浏览器都支持这个方法。
            if (request == false) {
                request = ActiveXobject("Msxml12.XMLHTTP");//使用较新版本的 IE 创建 IE 兼容的对象（Msxml2.XMLHTTP）。
            } else if (request == false) {
                request = ActiveXobject("Microsoft.XMLHTTP");//使用较老版本的 IE 创建 IE 兼容的对象（Microsoft.XMLHTTP）。
            } else if (request == false) {
                //alert("创建request失败！");
            } else {
                //alert("创建成功！")
            }
            createXmlHttpRequest();
            setInterval(function () {
                request.open("GET", "php/read.php", true);
                request.send(null);
                request.onreadystatechange = function () {
                    if (request.readyState == 4 && request.status == 200) {
                        //alert("服务器响应数据：" + this.responseText);
                        document.getElementById("con").innerHTML = this.responseText;
                    }
                }
            }, 2000);
        }
        getMass();
    </script>
</body>
</html>

php后端页面

conn.php:连接数据库

<?php
header("Content-Type:text/html;charset=utf8");
$mysql_server_name = "localhost:3306"; //连接数据库端口
$mysql_username = "root"; //用户名
$mysql_password = "123456"; //密码
$mysql_database = "test"; //数据库名称  
$conn = new Mysqli($mysql_server_name, $mysql_username, $mysql_password, $mysql_database); //构造函数mysql
// 检测连接
if ($conn->connect_error) {
    die("连接失败: " . $conn->connect_error);
    }
    echo "连接成功";
 

write.php:写入数据库消息

<?php
include_once 'conn.php';
$username = $_POST["username"];
$content = $_POST["content"];
// $username = "username";
// $content = "content";
$time = date("Y/m/d H:i:s");
if ($content == null) {
    echo "<script>alert('内容不能为空！')</script>";
} else {
    # code...
    $sql = "INSERT INTO message(time,username,message) VALUES('$time','$username','$content')";
    $conn->query($sql);
}

read.php :读取数据库中存入的消息

<?php
include_once 'conn.php';
$sql = "SELECT time,username,message FROM message";
$array = $conn->query($sql);
$data = mysqli_fetch_all($array, MYSQLI_NUM);
echo '<br/>';
// print_r($data);
   // echo file_get_contents("message.txt");
//echo $data[]
$count = count($data);
for ($i=0; $i <$count ; $i++) { 
   $temp =$data[$i];
   for ($j=0; $j < 3; $j++) { 
      # code...
      echo $temp[$j];
      echo '------';
   }
   echo '<br/>';
}
 

Php7+Mysql8实现简单的网页聊天室功能的更多相关文章

  1. Java和WebSocket开发网页聊天室

    小编心语:咳咳咳,今天又是聊天室,到现在为止小编已经分享了不下两个了,这一次跟之前的又不大相同,这一次是网页聊天室,具体怎么着,还请各位看官往下看~ Java和WebSocket开发网页聊天室 一.项 ...

  2. JavaWeb网页聊天室（WebSocket即时通讯）

    原文:http://baike.xsoftlab.net/view/656.html Git地址 http://git.oschina.net/loopcc/WebSocketChat 概要: Web ...

  3. 基于flask的网页聊天室（三）

    基于flask的网页聊天室(三) 前言 继续上一次的内容,今天完成了csrf防御的添加,用户头像的存储以及用户的登录状态 具体内容 首先是添加csrf的防御,为整个app添加防御: from flas ...

  4. 基于flask的网页聊天室（二）

    基于flask的网页聊天室(二) 前言 接上一次的内容继续完善,今天完成的内容不是很多,只是简单的用户注册登录,内容具体如下 具体内容 这次要加入与数据哭交互的操作,所以首先要建立相关表结构,这里使用 ...

  5. 基于flask的网页聊天室（一）

    基于flask的网页聊天室(一) 基本目标 基于flask实现的web聊天室,具有基本的登录注册,多人发送消息,接受消息 扩展目标 除基本目标外添加当前在线人数,消息回复,markdown支持,历史消 ...

  6. WebSocket 网页聊天室的实现（服务器端：.net + windows服务，前端：Html5）

    websocket是HTML5中的比较有特色一块,它使得以往在客户端软件中常用的socket在web程序中也能轻松的使用,较大的提高了效率.废话不多说,直接进入题. 网页聊天室包括2个部分,后端服务器 ...

  7. 使用Servlet和JSP实现一个简单的Web聊天室系统

    1 问题描述                                                利用Java EE相关技术实现一个简单的Web聊天室系统,具体要求如下. (1)编写一个登录 ...

  8. 基于Server-Sent Event的简单聊天室　Web 2.0时代，即时通信已经成为必不可少的网站功能，那实现Web即时通信的机制有哪些呢？在这门项目课中我们将一一介绍。最后我们将会实现一个基于Server-Sent Event和Flask简单的在线聊天室。

    基于Server-Sent Event的简单聊天室 Web 2.0时代,即时通信已经成为必不可少的网站功能,那实现Web即时通信的机制有哪些呢?在这门项目课中我们将一一介绍.最后我们将会实现一个基于S ...

  9. Netty学习笔记(四) 简单的聊天室功能之服务端开发

    前面三个章节,我们使用了Netty实现了DISCARD丢弃服务和回复以及自定义编码解码,这篇博客,我们要用Netty实现简单的聊天室功能. Ps: 突然想起来大学里面有个课程实训,给予UDP还是TCP ...

随机推荐

  1. 【Linux】CentOS7 常用命令集合

    CentOS7 常用命令集合 常用命令 文件与目录 操作命令解析 cd /home 进入 ‘/home’ 目录cd .. 返回上一级目录cd ../.. 返回上两级目录cd - 返回上次所在目录cp ...

  2. python 输出日志到文件和控制台

    import logging # 第一步,创建一个logger logger = logging.getLogger() logger.setLevel(logging.INFO) # Log等级总开 ...

  3. python数据处理（八）之展示数据

    1.前言 1.1.不要擅自假定要讲的故事和数据是一致的,要先研究数据,然后讲述数据研究所得 1.2.讲故事是成为领域专家的重要部分. 1.3.将故事方法: a. 确定想要讲的故事 b.无论选择什么方式 ...

  4. 机器学习实战基础（十一）：sklearn中的数据预处理和特征工程（四） 数据预处理 Preprocessing & Impute 之 处理分类特征：编码与哑变量

    处理分类特征:编码与哑变量 在机器学习中,大多数算法,譬如逻辑回归,支持向量机SVM,k近邻算法等都只能够处理数值型数据,不能处理文字,在sklearn当中,除了专用来处理文字的算法,其他算法在fit的 ...

  5. Python Ethical Hacking - BeEF Framework(1)

    Browser Exploitation Framework. Allows us to launch a number of attacks on a hooked target. Targets ...

  6. 【Python学习笔记五】re.findall()方法中,正则的"()"效果

    在笔记四中,使用正则去筛选数据时,使用了findall()这个方法,在使用时正则表达式中使用了到了"()",最初以为只是强调执行优先级,后来发现正则表达式中的每一个(),在find ...

  7. javascript兼容性：展开运算符 ... 的降级

    展开运算符 ... 是一个很好用的ES6新特性,用的好的话,可以节约很多代码. 但是作为ES6特性,它有兼容性问题,而且Babal(在线转码网页)并不会转换展开运算符. 展开运算符大体分为两种用法:展 ...

  8. 二进制图片blob数据转canvas

    javascript是有操作二进制文件的方法的,在这里就不详述了. 而AJAX的核心XMLHttpRequest也可以获取服务端给的二进制Blob. 可以参考: XMLHttpRequest Leve ...

  9. Makefile中的奇葩字符

    % : Makefile规则通配符,一般出现在目标或是依赖中 * : shell命令中的通配符,一般出现在命令中 $@:目标的名字 $^:所有依赖的名字 $<:第一个依赖的名字 $?:所有依赖中 ...

  10. mybatis逆向工程生成java代码和xml配置

    mybatis官方提供了一个逆向工程包,可以针对数据库表自动生成mybatis执行所需要的Pojo.Mapper xml文件.Mapper 接口文件. mybatis-generator有很多种用法: ...