600字范文,内容丰富有趣,生活中的好帮手!
600字范文 > html实现网页多人聊天 实现websocket多人聊天 很简单(示例代码)

html实现网页多人聊天 实现websocket多人聊天 很简单(示例代码)

时间:2022-06-12 07:02:45

相关推荐

html实现网页多人聊天 实现websocket多人聊天 很简单(示例代码)

go?

房间号相同的人能聊天

Flask Server

# -*- coding: utf-8 -*-

from flask import Flask, render_template

from flask_socketio import SocketIO, rooms

app = Flask(__name__)

app.config[‘SECRET_KEY‘] = ‘sldjfalsfnwlemnw‘

socketio = SocketIO(app)

@app.route(‘/chats/‘)

def index(room_id):

return render_template(‘chat.html‘, room_id=room_id)

@socketio.on(‘chat_send‘)

def chat_send(json):

print ‘chat_send: ‘, str(json)

room_id = None

if json.get(‘room_id‘, None):

room_id = json[‘room_id‘]

socketio.emit(‘chat_recv_{room_id}‘.format(room_id=room_id), json)

if __name__ == ‘__main__‘:

socketio.run(app, host=‘0.0.0.0‘, port=8080, debug=True)

templates/chat.html

Python Chat App Yo

integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

div.msg_bbl {

background-color: #ddd;

padding: 5px 10px;

border-radius: 10px;

color: #555;

margin-bottom: 5px;

}

WebScoket APP test.

没有任何消息..

输入你的消息并发送

Send

// 1. 监听connect事件

var socket = io.connect(‘http://‘ + document.domain + ‘:‘ + location.port);

socket.on(‘connect‘, function () {

var form = $(‘form‘).on(‘submit‘ ,function (e) {

e.preventDefault();

// 1.1 获取对象

let user_name = $(‘input.username‘).val();

let message = $(‘input.message‘).val();

// 1.2 发送数据到socket服务器

socket.emit(‘chat_send‘, {

room_id : {{ room_id }} ,

username : user_name,

message : message

});

$(‘input.message‘).val(‘‘).focus();

});

});

// 2. 监听response事件,服务器返回数据,并更新数据

socket.on(‘chat_recv_{{ room_id }}‘, function (data) {

// 数据发送到聊天框

console.log(data);

$(‘h1‘).remove();

let text = ‘

‘ + data.username+ ‘‘ +data.message+ ‘‘;

$(‘div.message_holder‘).append(text);

});

example:

ISSUE

走Reids 队列时hang住

房间号socket.io 没找到函数原型,不知道怎么调,走了个取巧的方式。

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。