http协定，是客户端每发送一个request，服务器返回一个response，没法做到服务器主意向客户端发送数据。我们要做一个网页版的聊天室，当一个人发送了音讯时，其他人怎么能看到这条信息呢？有一个做法就是在网页中不停的运转js，发送request给服务器，服务器不停返回response，当有新的音讯时显现在页面上。如许做毫无疑问会发生大批的http衔接，对服务器的机能和带宽都有影响。而websocket协定能够做到由服务器主意向客户端发送数据，当有新音讯时就主动发送给浏览器，浏览器将内容更新到页面上。更多关于这个协定的细致内容和引见，能够网上自行搜刮。

为了进修websocket，我们来完成一个超等简朴的网页聊天室，竖立一个html文件，页面显现结果以下，用一个大的div框架用来显现聊天记录，一个input输入内容，一个button用于发送信息：

前端运用js的socket.io，代码以下：

<script type="text/javascript" src="https://cdn.bootcss.com/socket.io/1.7.4/socket.io.min.js"></script>
<script type="text/javascript" charset="utf-8">
    var socket = io.connect('http://' + document.domain + ':' + location.port);
    var send = function () {
        var msg = document.querySelector("input").value;
        socket.emit('my event', {data: msg});
    };
    socket.on('res', function (msg) {
        document.querySelector(".content").insertAdjacentHTML(
            "beforeend",
            "<div class='message-div'><span class='message-content'>" + msg.data + "</span></div>"
        )
    })
</script>

上段代码起首运用cdn援用socket.io.min.js，然后与后端竖立衔接，接着定义了一个send要领（在html的button中运用onclikc绑定），该要领起首猎取input中的内容，然后运用emit要领将其发送到后端，后端(python+Flask-SocketIO)对应的代码是：

from flask import Flask, render_template
from flask_socketio import SocketIO
import config


app = Flask(__name__)
app.config.from_object(config)
socketio = SocketIO(app)


@app.route('/')
def index():
    return render_template('websocket.html')


@socketio.on('my event')
def handle_my_custom_namespace_event(data):
    socketio.emit("res", data)


if __name__ == "__main__":
    socketio.run(app)

代码中运用@socketio.on('my event')注册一个my event事宜（与前端socket.emit('my event', {data: msg})一致），然后再运用socketio.emit("res", data)将数据返回前端，前端又经由过程socket.on('res', callback)举行吸收，一切竖立了webscoket衔接的客户端都邑收到。此时全部流程就已很明白了，再梳理一遍就是：点击button后，触发send函数，猎取到input中的内容，然后将数据（正确来说是将照顾数据的事宜）发送给后端，后端对应这个事宜的函数（即运用@socketio.on('my event')注册的函数，相似路由的注册）就会实行，该后端函数向前端发送照顾一样数据的res事宜，前端socket.on('res', callback)收到’req’事宜后，运用callback回调函数处置惩罚（即向网页中增加内容）。

开两个浏览器窗口，就能够看出结果了，以下：