⻩荣奎（liamhuang）腾讯web前端⾼级⼯程师2011年毕业加⼊腾讯参与QQ秀，QQ农场，QQ牧场项⺫2013年 负责QQ会员，腾讯⼿机QQ游戏平台，在H5（Hybird App）⽅⾯有丰富的经验2016-⾄今 负责腾讯云⺴站服务，⺴络安全业务

H5

H5 •  window

•  DOM •  HTML5 DOM jQuery •  WXML mvvm

•  URL url •  •  Cookie

•  CS

•  ,

1 app.json

2 app.js

3 index.js

WXML（WeiXinMarkupLanguage

websocket

•  •  • 

•  • 

WebSocket

WebSocket

•  Cookie

•  •  • 

1.  code,rawData,signature

2. code,appid,appsecret

3. session_key

4. 5.

6. session_id

SDK SDK

Redis

•  appId appSecret • 

•  •  •  appId appSecret

请求登录(code, encryptedD ata, iv)

请求登录(code, encryptedD ata, iv)

jscode2session(code, appId, appSecret)

(session_key, openId)

(id, skey, userInfo)(id, skey)

w x.login() 获取 codew x.getU serInfo() 获取 (encryptedD ata, iv)

通过 (session_key, openId) 生成 (id, skey)

保存会话(id, skey)

通过 (session_key, iv)解密 encryptedD ata 得到 userInfo

w x.request()进行业务请求(id, skey)

检查会话(id, skey)

getStorage() 获取 (id, skey)

检查会话合法性

查询 userInfo

alt

会话非法

会话合法

(userInfo)

业务处理

错误信息错误信息

•  • 

•  •  SDK

WebSocket

•  WebSocket

•  •  •  • 

WebSocket •  •  • 

WebSocket

HTTPonTCP

SwitchProtocol WSonTCP

WebSocket

•  Socket.IO •  Socket.IO

•  Socket.IO

• 

WebSocket •  WebSocket •  Socket.IO • 

WebSocket •  PaaS WebSocket

WebSocket

TCP

HTTP(S)

HTTP(S)TCP

1. WebSocket

3. connectUrl

4.connectUrl

2. receiverUrl

5. WebSocket 6.

PaaS WS

a. b.

c. d.

PaaS WS

PaaS • 

•  •  WebSocket •  • 

•  •  • 

https://github.com/tencentyun/wafer

Wafer

SessionServer

PHPSDK

C#SDK

JavaSDK

NodeSDK

ClientSDK

Wafer

Wafer

Wafer +

Wafer

Wafer

Wafer

appid/appsecret

Wafer-

&

Wafer

That’s all Ques[onTime