websocket
WebSocket、HTTP 與 TCP
HTTP、WebSocket 等應用層協議，都是基於 TCP 協議來傳輸數據的。咱們能夠把這些高級協議理解成對 TCP 的封裝。
既然你們都使用 TCP 協議，那麼你們的鏈接和斷開，都要遵循 TCP 協議中的三次握手和四次揮手 ，只是在鏈接以後發送的內容不一樣，或者是斷開的時間不一樣.
咱們知道http是基於tcp實現的，瀏覽器能夠看作是客戶端socket，這個socket在開發的時候遵循http規範，數據在發送並接收成功的時候就斷開socket了，那麼若是咱們的socket一直鏈接不斷開，而且發送數據的時候都把數據進行加密，這樣是否是也是能夠的呢？這種想法就能夠引出websocket了，值得一提的是，websocket的兼容性不是全部版本的瀏覽器都支持(取決因而否可以new WebSocket), 可是隨着技術的發展，瀏覽器對websocket的支持確定會愈來愈好。
對於 WebSocket 來講，它必須依賴 HTTP 協議進行一次握手 ，握手成功後，數據就直接從 TCP 通道傳輸，與 HTTP 無關了。
Websocket和socket不一樣，Websocket工做在應用層，而socket是基於門面模式的一種封裝，可讓程序員簡便地寫網絡通訊程序html
flask實現websocket
安裝gevent-websocket模塊jquery
from flask import Flask,render_template,request
from geventwebsocket.handler import WebSocketHandler
from gevent.pywsgi import WSGIServer
import json
app = Flask(__name__)
USERS = {
'1':{'name':'jack','count':0},
'2':{'name':'tuple','count':0},
'3':{'name':'lily','count':100},
}
@app.route('/index')
def index():
return render_template('index.html',users=USERS)
# http://127.0.0.1:5000/message 既能夠接受http，也能夠接受websocket
WEBSOCKET_LIST = []
@app.route('/message')
def message():
ws = request.environ.get('wsgi.websocket')
if not ws:
return '您使用的是Http協議'
WEBSOCKET_LIST.append(ws)
while True:
# 當關閉webscoekt的時候cid 獲得None
cid = ws.receive()
if not cid:
WEBSOCKET_LIST.remove(ws)
ws.close()
break
old_count = USERS[cid]['count']
new_count = old_count + 1
USERS[cid]['count'] = new_count
for client in WEBSOCKET_LIST:
client.send(json.dumps({'cid':cid,'count':new_count}))
return ''
if __name__ == '__main__':
# 當請求是websocket的時候，那麼就用WebSocketHandler進行處理
http_server = WSGIServer(('0.0.0.0', 5000), app, handler_class=WebSocketHandler)
http_server.serve_forever()
index.html程序員
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>Title</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<h1>投票系統</h1>
<ul>
{% for k,v in users.items() %}
<li onclick="vote({{k}})" id="id_{{k}}">{{v.name}}<span>{{v.count}}</span></li>
{% endfor %}
</ul>
<script src="{{ url_for('static',filename='jquery-3.3.1.min.js')}}"></script>
<script>
var ws = new WebSocket('ws://127.0.0.1:5000/message');
// 事件監聽綁定回調函數，一旦有消息發送過來就會調用函數
ws.onmessage = function (event) {
/* 服務器端向客戶端發送數據時，自動執行 */
// {'cid':cid,'count':new}
var response = JSON.parse(event.data);
$('#id_'+response.cid).find('span').text(response.count);
};
function vote(cid) {
ws.send(cid)
}
</script>
</body>
</html>
webscoket 原理
websocket的握手須要藉助http, new WebSocket的時候，服務端接收到的的請求頭信息有有三個比較特殊：web
Sec-WebSocket-Key:FUH2Nige4Npq/InFS0OoJQ== Upgrade:websocket Connection: Upgrade
表示此次請求是用於升級http爲websocket，並把一個隨機字符串發送過去，此時服務端應該拿到這個字符串進行加密而後發送過去，瀏覽器對這個字符串也加密，比較加密後的字符串和服務端發送過來的字符串是否一致，一致就表名握手成功，此時response header爲json
Connection:Upgrade Sec-WebSocket-Accept:+lZCKceYfJsmNj6q0GYPa9r9LXE= Upgrade:websocket
狀態碼爲：101 Switching Protocols，表示協議切換成功，此時，後面的通訊就和http沒有半毛錢關係了。flask
自定義實現websocket服務端
def get_headers(data):
"""
將請求頭格式化成字典
:param data:
:return:
"""
header_dict = {}
data = str(data, encoding='utf-8')
header, body = data.split('\r\n\r\n', 1)
header_list = header.split('\r\n')
for i in range(0, len(header_list)):
if i == 0:
if len(header_list[i].split(' ')) == 3:
header_dict['method'], header_dict['url'], header_dict['protocol'] = header_list[i].split(' ')
else:
k, v = header_list[i].split(':', 1)
header_dict[k] = v.strip()
return header_dict
def send_msg(conn, msg_bytes):
"""
WebSocket服務端向客戶端發送消息
:param conn: 客戶端鏈接到服務器端的socket對象,即： conn,address = socket.accept()
:param msg_bytes: 向客戶端發送的字節
:return:
"""
import struct
token = b"\x81"
length = len(msg_bytes)
if length < 126:
token += struct.pack("B", length)
elif length <= 0xFFFF:
token += struct.pack("!BH", 126, length)
else:
token += struct.pack("!BQ", 127, length)
msg = token + msg_bytes
conn.send(msg)
import base64
import hashlib
import socket
sock = socket.socket(socket.AF_INET, socket.SOCK_STREAM)
sock.setsockopt(socket.SOL_SOCKET, socket.SO_REUSEADDR, 1)
sock.bind(('127.0.0.1', 8002))
sock.listen(5)
while 1:
# 1. 等待用戶鏈接
conn, address = sock.accept()
# 2. 接收驗證消息
msg = conn.recv(8096)
msg_dict = get_headers(msg)
# 3. 對數據加密, 其中魔法字符串'258EAFA5-E914-47DA-95CA-C5AB0DC85B11' 是固定的值
value = msg_dict['Sec-WebSocket-Key'] + '258EAFA5-E914-47DA-95CA-C5AB0DC85B11'
ac = base64.b64encode(hashlib.sha1(value.encode('utf-8')).digest())
# 4. 將加密後的結果返回給瀏覽器，發送的時候是用http通訊的，回消息的時候也要封裝成http格式
response_tpl = "HTTP/1.1 101 Switching Protocols\r\n" \
"Upgrade:websocket\r\n" \
"Connection: Upgrade\r\n" \
"Sec-WebSocket-Accept: %s\r\n" \
"WebSocket-Location: ws://127.0.0.1:8002\r\n\r\n"
response = response_tpl %(ac.decode('utf-8'),)
conn.send(response.encode('utf-8'))
# 5. 接受瀏覽器發送過來的加密數據，並進行解密，發送數據也須要進行加密，加密和解密規則能夠參考官方
while True:
info = conn.recv(8096)
# 10111111 去掉第一位，和 01111111 相與就行
payload_len = info[1] & 127
if payload_len == 127:
# 若是payload_len是127，那麼須要日後面取8個字節做爲頭信息，頭部總共10個字節
extend_payload_len = info[2:10]
mask = info[10:14]
decoded = info[14:]
elif payload_len == 126:
# 若是payload_len是126，那麼須要日後面取2個字節做爲頭信息，頭部總共4個字節
extend_payload_len = info[2:4]
mask = info[4:8]
decoded = info[8:]
else:
# 若是payload_len小於126，那麼頭部總共2個字節
extend_payload_len = None
mask = info[2:6]
decoded = info[6:]
bytes_list = bytearray()
# decoded 是真實的數據
for i in range(len(decoded)):
chunk = decoded[i] ^ mask[i % 4]
bytes_list.append(chunk)
body = str(bytes_list, encoding='utf-8')
print('瀏覽器發送過來的數據',body)
#
# import time
# time.sleep(2)
send_msg(conn,body.encode('utf8'))
相關文章
- 1. 【WebSocket】WebSocket介紹
- 2. WebSocket（5）-- WebSocket Server
- 3. WebSocket(1)---WebSocket介紹
- 4. [websocket]springboot實現websocket
- 5. WebSocket-bench測試WebSocket
- 6. websocket --- 05 . http與websocket
- 7. WebSocket
- 8. webSocket
- 9. websocket
- 10. Websocket
- 更多相關文章...
- • 蘋果 Safari 瀏覽器 - 瀏覽器信息
- • Mozilla Firefox 瀏覽器 - 瀏覽器信息
相關標籤/搜索
每日一句
-
每一个你不满意的现在，都有一个你没有努力的曾经。
歡迎關注本站公眾號,獲取更多信息
