使用flask_socketio實現客戶端間即時通訊
前期沒有來得及好好總結，現在複習總結一下：
Socket.IO 背後主要的思想是你可以傳送和接收想要的任何事件，攜帶你想要的任何資料。任何可以編碼為 JSON 的物件都可以做到，並且也支援二進位制資料。1.Express 初始化 app 作為功能處理器，你可以將它傳給 HTTP 伺服器。
2.定義一個路由處理器 / ，當我們訪問網站主頁時就會呼叫這個處理器。
3.HTTP 伺服器監聽埠 3000。
通過傳遞 http（HTTP 伺服器）物件初始化了一個 socket.io 的新例項。然後為到來的 socket 監聽 connection 事件，並且輸入日誌到控制檯。
這將載入 socket.io-client，建立全域性變數 io，並且連線
下一個目標是我們從伺服器傳送事件給其他使用者。
為了傳送事件給所有人，Socket.IO 給我們提供了 io.emit：
io.emit('some event', { for: 'everyone' });
如果你想傳送一個確定 socket 的訊息給所有人，我們有 broadcast 標識：
io.on('connection', function(socket){
socket.broadcast.emit('hi');
}); 下面是參考：
關於flask_socketio的入門可以看我的上一篇部落格《使用flask_socketio實現服務端向客戶端定時推送》
用socketio實現即時通訊十分簡單，只需要客戶端傳送使用者輸入的資訊到後端，後端再將此資訊廣播到所有連線到此命名域的客戶端就可以了。
from flask import Flask, render_templatefrom 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>
開啟兩個網頁都連線到http://127.0.0.1:5000/，測試一下，一個網頁傳送的資訊在另一個網頁也可以及時收到。一個簡陋的多人聊天系統完成了：）
用socketio實現即時通訊十分簡單，只需要客戶端傳送使用者輸入的資訊到後端，後端再將此資訊廣播到所有連線到此命名域的客戶端就可以了。
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>
開啟兩個網頁都連線到http://127.0.0.1:5000/，測試一下，一個網頁傳送的資訊在另一個網頁也可以及時收到。一個簡陋的多人聊天系統完成了：）