目錄

1 問(wèn)題描述

小程序成功登陸后，安卓用戶(hù)預(yù)約操作時(shí)，偶爾會(huì)出現(xiàn)登陸異常情況。

2 登陸實(shí)現(xiàn)方案

后端Cookie校驗(yàn)用戶(hù)登陸狀態(tài)

3 排查過(guò)程

1）后臺(tái)日志排查，用戶(hù)Cookie無(wú)效

2）微信小程序日志排查，安卓用戶(hù)有問(wèn)題

3）現(xiàn)象復(fù)現(xiàn)，安卓手機(jī)提示異常

4）微信小程序埋點(diǎn)輸出日志，Cookie存取正常

5）正常與異常Cookie對(duì)比，Cookie順序不對(duì)

6）異常Cookie排查，Cookie拼接不正確

4 為什么蘋(píng)果手機(jī)、部分安卓手機(jī)沒(méi)有問(wèn)題？

5 問(wèn)題原因

騰訊小程序Bug，Set-Cookie逗號(hào)拼接方式有問(wèn)題

6 解決方法

Cookie正則分割，分號(hào)重新拼接

7 標(biāo)準(zhǔn)答案

8 硬廣告

微信預(yù)約小程序，14天免費(fèi)使用

---

1 問(wèn)題描述

最近有用戶(hù)反饋，小程序登陸有問(wèn)題

小程序成功登陸后，安卓用戶(hù)預(yù)約操作時(shí)，偶爾會(huì)出現(xiàn)登陸異常情況。

之前解決過(guò)shiro登陸失敗的問(wèn)題，《Shiro框架Given final block not properly padded問(wèn)題解決》，但是沒(méi)有徹底解決登陸失敗的問(wèn)題。

登陸失敗現(xiàn)象極其詭異，問(wèn)題難以復(fù)現(xiàn)。

1 用戶(hù)10秒前剛登陸，用戶(hù)后續(xù)操作馬上提示“登陸異?！?/p>

2 部分安卓用戶(hù)在登陸后，在后續(xù)操作提示“登陸異?！?#xff0c;這種現(xiàn)象是偶然發(fā)生的，安卓用戶(hù)出現(xiàn)登陸異常概率大概是10分之1。

2 蘋(píng)果用戶(hù)從未沒(méi)有出現(xiàn)”登陸異?！艾F(xiàn)象。

2 登陸實(shí)現(xiàn)方案

在介紹問(wèn)題前，本文先簡(jiǎn)單描述下本文應(yīng)用登陸實(shí)現(xiàn)方案。

本文的小程序應(yīng)用是單獨(dú)使用Cookie來(lái)維護(hù)登陸狀態(tài)，登陸并未使用小程序的sessionKey來(lái)維護(hù)后臺(tái)登陸狀態(tài)。

后端Cookie校驗(yàn)用戶(hù)登陸狀態(tài)

為什么不使用小程序SessionKey維護(hù)登陸狀態(tài)？

1 老應(yīng)用有單獨(dú)Cookie登陸方式。

2 后臺(tái)支持多平臺(tái)登陸（比如小程序、h5網(wǎng)頁(yè)等），不完全依賴(lài)小程序SessionKey完成登陸 。

Shiro控制用戶(hù)權(quán)限

1 獲取微信小程序code值

2 code值以及appId換取用戶(hù)openId

3 openId快捷登陸

4 小程序保存登陸Cookie

5 小程序攜帶Cookie請(qǐng)求后端應(yīng)用

6 后端根據(jù)前端的Cookie校驗(yàn)用戶(hù)的登陸情況

可惜小程序不支持Cookie，（瀏覽器一般會(huì)保存用戶(hù)Cookie，方便后續(xù)瀏覽網(wǎng)頁(yè)使用）

如何解決小程序支持Cookie登陸？

以下是網(wǎng)上常見(jiàn)的Cookie登陸解決方式。

// 登錄
      wx.login({
        success: function (res) {
          log.info(res)
          //獲取登錄的臨時(shí)憑證
          var code = res.code;
          //調(diào)用后端，獲取微信的session_key,secret
          wx.request({
            url: domain + '/user/wxLogin',
            header: {
              "Content-Type": "application/x-www-form-urlencoded"
            },
            method: "POST",
            data: util.json2Form({
              code: code,
              appId: that.globalData.appId
            }),
            success: function (result) {
              // cookie存儲(chǔ)起來(lái)
              var cookie = result.header['Set-Cookie']
              wx.setStorageSync('cookie', cookie)
              
            },
            fail: function (res) {
              
            }
          })
        }
      })
    })

wx.request從res.header['Set-Cookie']中獲取cookie信息，并使用wx.setStoargeSync將cookie信息同步寫(xiě)入小程序私有存儲(chǔ)空間中

wx.request({
      url: domain + '/api/xxx/xxx',
      header: {
        "Content-Type": "application/x-www-form-urlencoded",
        'cookie': wx.getStorageSync("cookie")
      },
      method: 'POST',
      data: util.json2Form({ xx1: xx1, xx2: xx2 }),
      success: function (result) {
        
      },
      fail: function (res) {
        log.info("服務(wù)器異常:" + res)
        wx.showToast({
          title: '服務(wù)器異常',
          icon: 'none',
          duration: 2000
        })
      }
    })

wx.getStorageSync同步將cookie從小程序中取出，小程序攜帶該cookie請(qǐng)求后臺(tái)服務(wù)，完成用戶(hù)登陸狀態(tài)校驗(yàn)。

3 排查過(guò)程

問(wèn)題不可怕，可怕的是不能穩(wěn)定地復(fù)現(xiàn)case。本人平時(shí)使用iphone手機(jī)，重復(fù)用戶(hù)的操作，基本復(fù)現(xiàn)不出來(lái)“登陸異常”的現(xiàn)象，只能在服務(wù)后臺(tái)以及小程序前端瘋狂埋點(diǎn)打日志。

1）后臺(tái)日志排查，用戶(hù)Cookie無(wú)效

從后臺(tái)日志可以看出，用戶(hù)成功登陸，但是用戶(hù)沒(méi)有在后續(xù)的請(qǐng)求使用用有效cookie去請(qǐng)求后臺(tái)服務(wù)，后臺(tái)直接拒絕服務(wù)。

2）微信小程序日志排查，安卓用戶(hù)有問(wèn)題

通過(guò)后臺(tái)和小程序日志發(fā)現(xiàn)，出現(xiàn)“登陸異?！钡挠脩?hù)基本是安卓用戶(hù)，蘋(píng)果用戶(hù)基本沒(méi)有這個(gè)問(wèn)題。

3）現(xiàn)象復(fù)現(xiàn)，安卓手機(jī)提示異常

目標(biāo)鎖定安卓手機(jī)，直接找了臺(tái)安卓手機(jī)，重復(fù)登陸、預(yù)約操作，大概反復(fù)操作10次，終于復(fù)現(xiàn)了“登陸異?！钡默F(xiàn)象，喜大普奔啊。

4）微信小程序埋點(diǎn)輸出日志，Cookie存取正常

起初懷疑wx.setStoargeSync有bug，未將cookie成功寫(xiě)入小程序。

驗(yàn)證方式：將res.header['Set-Cookie']、wx.getStorageSync日志輸出。

如果res.header['Set-Cookie']輸出日志為空，則定位是后端服務(wù)問(wèn)題，未將cookie攜帶返回。

如果res.header['Set-Cookie']輸出日志不為空，wx.getStorageSync('cookie')輸出日志為空，則定位setStorageSync寫(xiě)入有bug

但是最終現(xiàn)象res.header['Set-Cookie']、wx.getStorageSync('cookie')輸出日志均不為空，排查思路中斷了。

5）正常與異常Cookie對(duì)比，Cookie順序不對(duì)

對(duì)比正常請(qǐng)求的cookie與異常請(qǐng)求的cookie

發(fā)現(xiàn)cookie的順序不一樣

后臺(tái)shiro做權(quán)限控制，返回3個(gè)Set-Cookie值，蘋(píng)果用戶(hù)的請(qǐng)求基本是以JESSIONID開(kāi)頭，而有問(wèn)題的安卓用戶(hù)請(qǐng)求是以remeberMe=Delete開(kāi)關(guān)

6）異常Cookie排查，Cookie拼接不正確

將登陸異常請(qǐng)求的cookie按照正常請(qǐng)求cookie的順序調(diào)整了下， 用戶(hù)請(qǐng)求后端可以成功登陸。

使用錯(cuò)誤順序cookie請(qǐng)求后端，后端解析cookie并未獲取到JESSIONID。

后端是如何解析Cookie，根據(jù)分號(hào)";"分割Cookie字符串，由于錯(cuò)誤順序Cookie是使用逗號(hào)做分割符，后端將Expires與JESSIONID視為一個(gè)整體，所以無(wú)法解析出JESSIONID

4 為什么蘋(píng)果手機(jī)、部分安卓手機(jī)沒(méi)有問(wèn)題？

沒(méi)有問(wèn)題的Cookie，JESSIONID可以被后臺(tái)正確分割出來(lái)。蘋(píng)果手機(jī)獲取Set-Cookie順序是嚴(yán)格一致的，安卓手機(jī)Set-Cookie順序是隨機(jī)的。

5 問(wèn)題原因

騰訊小程序Bug，Set-Cookie逗號(hào)拼接方式有問(wèn)題

微信開(kāi)放社區(qū)也有人反饋過(guò)這個(gè)bug，但是以微信社區(qū)人員解決問(wèn)題的稀爛態(tài)度，至今未解決該bug。

解決bug只能靠自己去兼容這個(gè)bug

6 解決方法

當(dāng)返回結(jié)果的header有多個(gè)Set-Cookier時(shí)，微信小程序獲取res.header['Set-Cookie']，已經(jīng)是將Set-Cookie用逗號(hào)拼接好的字符串。

如果使用簡(jiǎn)單的逗號(hào)分割，Expires時(shí)間也含有逗號(hào)，Cookie結(jié)果是錯(cuò)誤的。

Cookie正則分割，分號(hào)重新拼接

見(jiàn)示例

簡(jiǎn)單的逗號(hào)無(wú)法分割，可以使用正則表達(dá)式去分割Cookie字符串，

需要被分割的逗號(hào)，后繼字符串是含有=

7 標(biāo)準(zhǔn)答案

微信小程序使用Cookie登陸標(biāo)準(zhǔn)答案

// 登錄
      wx.login({
        success: function (res) {
          log.info(res)
          //獲取登錄的臨時(shí)憑證
          var code = res.code;
          //調(diào)用后端，獲取微信的session_key,secret
          wx.request({
            url: domain + '/user/wxLogin',
            header: {
              "Content-Type": "application/x-www-form-urlencoded"
            },
            method: "POST",
            data: util.json2Form({
              code: code,
              appId: that.globalData.appId
            }),
            success: function (result) {
              // Set-Cookie字符串獲取
              var cookie = result.header['Set-Cookie']
              // 字符串分割成數(shù)組
              var cookieArray = cookie.split(/,(?=[^,]*=)/)
              // 分號(hào)拼接數(shù)組
              var newCookie = cookieArray.join(';')
              // 存儲(chǔ)拼接后的cookie
              try {
                wx.setStorageSync('cookie', newCookie)
              } catch (error) {
                log.error('setStorageSync cookie fail')
              }
              
            },
            fail: function (res) {
              
            }
          })
        }
      })

8 硬廣告

個(gè)人閑暇時(shí)間做了一款微信預(yù)約小程序，如果您有場(chǎng)地預(yù)約、實(shí)驗(yàn)室預(yù)約、課程預(yù)約、辦事預(yù)約需求，可以嘗試使用下這一款預(yù)約小程序。

微信預(yù)約小程序，14天免費(fèi)使用

https://blog.csdn.net/czx0132/article/details/109134306