关于socket.io+express的cli脚手架+sql
首先下载socket.io.js 下载地址https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.2.0/socket.io.js
新建一个html文件,你可以在文件里面直接引入上面的那个地址,
在文件中使用jq
例如:
<!doctype html>
<html>
<head>
<title>Socket.IO chat</title>
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font: 13px Helvetica, Arial;
}
form {
background: #000;
padding: 3px;
position: fixed;
bottom: 0;
width: 100%;
}
form input {
border: 0;
padding: 10px;
width: 90%;
margin-right: .5%;
}
form button {
width: 9%;
background: rgb(130, 224, 255);
border: none;
padding: 10px;
}
#messages {
list-style-type: none;
margin: 0;
padding: 0;
}
#messages li {
padding: 5px 10px;
}
#messages li:nth-child(odd) {
background: #eee;
}
#messages {
margin-bottom: 40px
}
</style>
</head>
<body>
<ul id="messages"></ul>
<form action="">
<input id="m" autocomplete="off" /><button>发送</button>
</form>
</body>
</html>
<script src='./Socket/Socket.js'></script>
<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<script>
$(function () {
var socket = io("ws://192.168.124.39:3000");
$('form').submit(function () {
socket.emit('chat message', $('#m').val());
$('#m').val('');
return false;
});
socket.on('chat message', function (msg) {
$('#messages').append($('<li>').text(msg));
});
});
</script>
这是前端文件 ↑
后台使用express :首先下载node,然后下载express脚手架,直接在百度搜索就可以,
打开文件夹然后 新建文件夹
然后 写上代码
var express = require('express');
var router = express.Router();
const mysql = require('mysql');
const connection = require('../public/javascripts/mysql');
var socketio = {}
var socket_io = require('socket.io');
//获取io
socketio.getSocketio = function (server) {
var io = socket_io.listen(server)
console.log(server);
console.log('--------------');
console.log(io);
io.on('connection', function (socket) {
// console.log('a user connected!');
socket.emit('sendMsg', 'i am ' + socket.id);
socket.on('myId', function (msg) {
console.log(msg);
console.log(socket.id);
var socketId=socket.id;
let sql=`UPDATE users SET socket='${socketId}' WHERE id=?`
connection.query(sql,[msg],(error, results, fields) => {
});
});
socket.on('userMsg', function (msg) {
console.log(msg);
console.log(msg[0]);//对方的消息
console.log(msg[1]);//对方的id
console.log(msg[2]);//自己的id
console.log(msg[3]);//自己的name
// if(msg[1]==1){
// var xxx=2
// }else{
// var xxx=1
// }
// });
connection.query("select * from users where id=?",[msg[1]],(error, results, fields) => {
console.log(results);
console.log(results[0].socket);
console.log([1,msg[2],msg[3],results[0].id,results[0].user,msg[0]]);
// connection.query("INSERT INTO talks (id,user_id,user_name,friend_id,firend_name,talk) VALUES (?,?,?,?,?,?)",[1,msg[2],msg[3],results[0].id,results[0].user,msg[0]],(error, results, fields) => {
// //插入语句
// console.log(results);
// });
connection.query("INSERT INTO talks VALUES (?,?,?,?,?,?)",[null,msg[2],msg[3],results[0].id,results[0].user,msg[0]],(error, results, fields) => {
//插入语句
console.log('======x=========');
});
socket.to(results[0].socket).emit('sendMsg', 'from ' + msg[0]);
});
});
});
}
module.exports = socketio;
接下来是最关键的一步
之后在创建数据库
const mysql = require('mysql');
const connection = mysql.createConnection({
host: 'localhost', //数据库主机名
user: 'root', //数据库用户名
password: '123456', //数据库密码
database: 'chat' //数据库名称
})
connection.connect();
module.exports = connection;
在这引入就行了ok 你已经实现了聊天;我在努力写个模仿qq出来到时候放到csd那上面;如果有不清晰的话欢迎给我留言;手把手教学