使用flask_socketio實現客戶端間即時通訊

時間 2020-06-09

標籤使用 flask socketio 實現客戶端即時通訊欄目 Python 简体版

原文原文鏈接

　　關於flask_socketio的入門能夠看個人上一篇博客《使用flask_socketio實現服務端向客戶端定時推送》javascript

　　用socketio實現即時通訊十分簡單，只須要客戶端發送用戶輸入的信息到後端，後端再將此信息廣播到全部鏈接到此命名域的客戶端就能夠了。html

from flask import Flask, render_template from flask_socketio import SocketIO,emit app = Flask(__name__) app.config['SECRET_KEY'] = 'secret!' socketio = SocketIO(app) @app.route('/') def index(): return render_template('index.html') @socketio.on('imessage', namespace='/test_conn') def test_message(message): emit('message',//後端廣播信息的事件名最好跟前端發送信息的事件名不同 {'data': message['data']}, broadcast=True) if __name__ == '__main__': socketio.run(app, debug=True)

　　關鍵就是要在emit中加broadcast=True這一項，若是不加，只有發送信息的客戶端能收到消息前端

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title></title>
    <script type="text/javascript" src="//code.jquery.com/jquery-1.4.2.min.js"></script>
    <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/socket.io/1.3.5/socket.io.min.js"></script>
    <script type="text/javascript"> $(document).ready(function() { namespace = '/test_conn'; var socket = io.connect(location.protocol + '//' + document.domain + ':' + location.port + namespace);
　　　　　　　//鏈接後發送日誌 socket.on('connect', function(){ console.log('connected') });
　　　　　　　//點擊發送時將text框的內容發送到後端 $('form#emit').submit(function(event) { socket.emit('imessage', {data: $('#emit_data').val()}); return false; });
　　　　　　 //接收後端廣播的信息 socket.on('message', function(msg) { $('#log').append('<br>' + $('<div/>').text(msg.data).html()); }); }); </script>
</head>
<body>
  <form id="emit" method="POST" action='#'>
      <input type="text" name="emit_data" id="emit_data" placeholder="Message">
      <input type="submit" value="發送">
  </form>
  <h2>Receive:</h2>
  <div id="log"></div>
</body>
</html>