前端补充协议

http协议

所有web框架都是由socket衍生出来的，socket通过tcp进行连接，web框架通过http协议连接。
http协议： 浏览是socket客户端，在浏览器输入服务端ip，只要accept连接成功，就可以收发数据，浏览器send一堆字符串，遵循http协议，格式：请求头，请求体组成的字符串。服务端解析字符串，按照固定的格式解析出来。返回给浏览器数据，也遵循http协议。连接即断开，一次请求一次响应就断开。
所有http就是建立在tcp协议的一个规范，规定发送数据的格式和请求响应后断开连接。也就是无状态（断开后之前的就不认识了），短链接（一次请求响应断开close ）。
如：在浏览器发送baidu.com
a. 向百度发送连接请求
b. 百度接受浏览器发送的链接请求，recv状态
c. 浏览器socket.send(‘GET /s?wd=十六进制 Http1.1/r/nAccept-Encoding: gzip, deflate, br\r\nHost: www.baidu.com\r\nUser-Agent: …’)
get请求没有请求体，请求头和请求体分割\r\n\r\n

d. 百度接收到用户发送的数据 data = server.recv(8096)，进行业务处理，根据wd搜索的关键字检索本地和json相关的数据，再给用户返回数据。响应头，响应体


响应体反应到浏览器上了
e. 浏览器和服务端端口链接。
再一次搜索以上步骤再会走一遍。

• http协议常见的请求头，描述发送者的基本信息
  content-type：指定请求体中发送的数据格式
  user-agent：我的设备信息，如：来自于xx设备的评论
  cookies：保存原来服务端给客户端写入的信息。
  accept：告诉服务器客户端能接受的数据格式
  host：当前要访问的主机信息
  referer：防盗链。跳转时访问其他页面把原来的网页携带上。如：访问博客园，浏览器打印了博客园的网站，回车后返回博客园的信息，如访问一篇文章，里面包含图片，再发请求，把图片内容下载后，浏览器才能展示，如51cto，51cto返回图片过程中用户不知道是51cto网站的东西，但是博客园利用了这个，博客园不用存储图片了，51cto免费存图片，而访问图片要消耗流量和钱，没有获利只有付出。于是就返回给博客园不显示图片，返回图片：请访问51cto，把用户导入了，分流了。src发get请求，浏览器吧当前url放到referer中，51cto判断是不是博客园，如果不是博客园就只能发公告或别的图片，如果是就给他看，
• 请求的方式
  get。put，delete，post，patch，opthons：跨域发ajax复杂请求，做预检，
• 响应状态码
  200 201 成功
  301 临时重定向 302 永久重定向
  402：客户端错误 url not found 403：客户端csrf token 错误
  500 服务端代码错误

websocket协议

• 存在意义：服务端主动向客户端推送消息
• websocket和http协议的区别
  http无状态，无法找到对方主动发消息，只能响应对方的消息，属于单工模式。
  websocket不断开时双方就可以相互发send消息。双工通道。
  如：浏览器弹出广告。
• websocket原理
  websocket也是使用的tcp，是基于tcp创建的，利用http协议并加以改造。规定了发送数据的格式及是否断开连接（不断开）。
• 过程：

1. 客户端浏览器向服务端发送websocket连接的请求，按websocket请求通过tcp添加了一个socket连接connect，
2. 服务端接收到连接accept，开始recv，浏览器向服务端发送字符串（遵循http协议的格式，如：GET/s?wd='linda' Http1.1\r\nAccept-Encoding:gzip,\r\nHost:www.xxx.com\r\nSec-WebSocket-Key:askdjfaaskdfjlasdjkf\r\n,）

服务端接收到客户请求，解析随机字符串，对其进行加密，加密方法：‘askdjfaaskdfjlasdjkf ’+ ‘258EAFA5-E914-47DA-95CA-C5AB0DC85B11’（全球公认：魔法字符串），对他们进行拼接，加密（全球公认算法），得到密文字符串。再将密文字符串返回给浏览器（遵循http格式返回，有响应头，响应体），如：响应头：HTTP/1.1 101 …\r\nSec-WebSocket-Accept:密文\r\n\r\n
3. 浏览器进行校验，内置的功能可以完成校验，浏览器报错：连接失败，没报错：连接成功。

例：
第一次握手环节：
客户端的浏览器发送WebSocket请求

服务端代码

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)


conn, address = sock.accept()


data = conn.recv(1024)

print(data)


conn.close()
sock.close()

服务端拿到客户端发送的请求：

b'GET / HTTP/1.1\r\nHost: 127.0.0.1:8002\r\nConnection: Upgrade\r\nPragma: no-cache\r\nCache-Control: no-cache\r\nUser-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/68.0.3440.75 Safari/537.36\r\nUpgrade: websocket\r\nOrigin: http://localhost:63342\r\nSec-WebSocket-Version: 13\r\nAccept-Encoding: gzip, deflate, br\r\nAccept-Language: zh-CN,zh;q=0.9\r\nCookie: csrftoken=m36aBGOEbBwG6ddvNbvbf7SddSE14Qg0rin5vDgsAqP4C34qeufiYC4Nr3Ei43zP\r\nSec-WebSocket-Key: dovhwrbqlcKJqaXGYplq5g==\r\nSec-WebSocket-Extensions: permessage-deflate; client_max_window_bits\r\n\r\n'

该请求，遵循了http协议，关键是请求头的随机字符串：Sec-WebSocket-Key: dovhwrbqlcKJqaXGYplq5g==

第二次握手环节：

服务器拿到数据后进行验证及加密，返回给服务端浏览器

import socket
import hashlib
import base64

def get_headers(data):
    '''
        将请求头格式化成字典
    '''
    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

sock = socket.socket(socket.AF_INET, socket.SOCK_STREAM)
sock.setsockopt(socket.SOL_SOCKET, socket.<