背景:

不知道大家沒有沒接觸過微信自動添加好友的軟件,還有第三方基于微信做的功能,如分流搶票中的微信通知,可以指定人發消息,還有一些,微信集成機器人的功能.總之我對這一類的軟件始終保持著強烈的求知欲和好奇心.終于有一天我忍不住揭開它神秘的面紗,看看她誘人的絲襪下掩蓋著著的到底是怎樣一雙美腿. 終于,終于,我找到了揭開那層面紗的關鍵詞.微信web端通信協議

開始:

善用搜索的人,可能已經讀過一篇解析微信網頁版api的文章了,我也是看了那篇文章才想細細的研究一遍,求甚解.

打開微信網頁版 你會看到一個二維碼,打開控制臺,點擊netweok你會看到所有請求.

通過分析不難發現,頁面優先調取了一個https://login.wx.qq.com/jslogin 接口 獲取uuid,然后使用uuid去獲取二維碼https://login.weixin.qq.com/qrcode/IeJfvSS6vw==

最后調取一個接口去監聽用戶掃描二維碼.

那么掃描就分為了三部分

1:獲取UUID

2:獲取二維碼

3:監聽用戶掃描二維碼

部分截圖

一步一步說

獲取UUID

代碼寫的有點糙了,大佬湊合著看吧.

接口詳細描述

地址:url: https://login.wx.qq.com/jslogin參數:appid: wx782c26e4c19acffb // 隨便寫fun: new // 固定newlang: zh_CN // 固定zh_CN_: 1554721401246 // 當前時間戳

router.get('/', function (req, res, next) {  let getUUID = function () {    axios.get('https://login.wx.qq.com/jslogin', {      params: {        appid: global.appId,        redirect_uri: 'https://wx.qq.com/cgi-bin/mmwebwx-bin/webwxnewloginpage',        fun: 'new',        lang: 'zh_CN',        _: +new Date()      }    }).then(loginRes => {      console.log(loginRes.data)      uuid = loginRes.data.split(';')[1].split('= ')[1].replace(/"/g, "")      global.uuid = uuid      console.log('UUID為____' + uuid)      res.render('index', {        title: 'Express',        imgData: `https://login.weixin.qq.com/qrcode/${uuid}`      });    })  }  getUUID()});

此處注意坑點1:該接口返回結果不是json而是text

需要自己處理轉換

獲取二維碼地址

uuid就是上一步的返回值https://login.weixin.qq.com/qrcode/${uuid}

監聽二維碼掃描

// 監聽掃描結果方法async function _queryScanStatus(tip) {  let url = 'https://wx.qq.com/cgi-bin/mmwebwx-bin/login'  let body = {    tip: tip,    uuid: global.uuid,    _: +new Date(),    loginicon: true  }  let res = await axios.get(url, {params: body})  return dataToJson(res.data)}// 監聽掃描結果入口async function getScanResult() {  let scanRes = await _queryScanStatus(1)  if (scanRes['window.code'] == 201) {    let confirmRes = await _queryScanStatus(0)    if (confirmRes['window.code'] == 200) {      let data = queryToJson(confirmRes['window.redirect_uri'])      return data    }  }}function queryToJson(url) {  let index = url.indexOf('?')  let apiURL = url.substr(0, index)  let query = url.substr(index + 1)  let data = dataToJson(query, '&')  data.apiURL = apiURL  return data}// 監聽第一階段router.get('/listnScan', function (req, res) {  _queryScanStatus(1).then(scanRes => {    if (scanRes['window.code'] == 201) {      res.json({scanRes})    }  })})// 監聽第二階段router.get('/listnScanConfirm', function (req, res) {  _queryScanStatus(0).then(confirmRes => {    if (confirmRes['window.code'] == 200) {      let data = queryToJson(confirmRes['window.redirect_uri'])      res.json({data})    }  })})

此處一開始我很難理解, 或者去監聽用戶掃描了,困擾了我很久,但當我注意到調取這個接口會,服務一直處于pending狀態我就立即明白了,原來用了那么low的處理啊.

注意這里需要二次調取接口,一次是用戶掃描,一次是用戶點擊了確定登錄的按鈕.

代碼如上:

接口詳細描述:

接口地址url: https://login.wx.qq.com/cgi-bin/mmwebwx-bin/login請求方式method: get參數loginicon: true // 固定rueuuid: 4db-Azt7kA== // 第一步獲取的uuidtip: 0 // 固定值 0獲取1 0:是否掃描; 1:是否確定登錄r: 56037589 // _: 1554722097962 // 當前時間戳

代碼地址

過程:

整個過程還是挺有意思的,目前代碼才剛寫到用戶點擊確定登錄的監聽, 初始化用戶數據還沒做. 我會慢慢加上去的,后續還考慮封裝api供第三方使用.如果你也想參與請在下方評論留言

高潮:

除了那個監聽用戶掃描狀態的接口比較耗時了一些,還有就是解析返回結果

用戶掃描后,會返回用戶頭像的接口這個接口奇坑無比. 有多種數據格式返回,需要做兼容.具體請看代碼

另外需求注意的一點是 生成二維碼和去監聽掃描決不能同時去請求, 否則會報超時返回408