今天无意间使用了一下网页版微信,出于前端的本能就打开了Network,想看一下微信消息接收的实现,想象中的Websocket并没有出现,自己尝试用手机给网页微信发送几条消息,发现网页微信的实现比想象中的要简单很多。

大致原理(长轮询):

  • 1.微信网页端动态创建script,src为’https://webpush.wx.qq.com/cgi-bin/mmwebwx-bin/synccheck'与一些参数。
  • 2.该请求会一直处于pending状态,pending状态最多维持约25秒。
  • 3.当微信号接收到消息,该请求会返回内容’window.synccheck={retcode: “0”, selector: “2”}’,接着浏览器端会发起请求拉取最新消息,然后网页微信端重新创建script,回到第一步。
  • 4.如果25秒后仍没有接收到消息,会返回window.synccheck={retcode: “0”, selector: “0”},网页微信端会重新创建script,回到第一步。