Taro中使用getUserInfo獲取資訊及授權遇坑

文章目錄

Taro中使用getUserInfo獲取資訊及授權遇坑
- Taro檔案及小程式檔案的翻找
- 以下為嘗試內容（并沒有成功）
- 總結

首先宣告這個并不是Taro的坑，而是微信小程式的坑，寫篇文章記錄一下，

背景：由于對taro用的并不是很熟練，導致上手還是對它很不滿意的，但是隨著深入發現寫起來還是很舒服，

Taro檔案及小程式檔案的翻找

在Taro的檔案中我們可以看到在如圖位置找到這個對應介面

在這里插入圖片描述

但是我們想使用這個介面的話，我們必須要在用戶授權過的情況下，因此我們需要先去授權，

如下如位置：

在這里插入圖片描述

在下方它的獲取錄音的示例中

// 可以通過 Taro.getSetting 先查詢一下用戶是否授權了 "scope.record" 這個 scope
Taro.getSetting({
  success: function (res) {
    if (!res.authSetting['scope.record']) {
      Taro.authorize({
        scope: 'scope.record',
        success: function () {
          // 用戶已經同意小程式使用錄音功能，后續呼叫 Taro.startRecord 介面不會彈窗詢問
          Taro.startRecord()
        }
      })
    }
  }
})

結合上述檔案我們可以的出，我們好像可以通過更改scope的值來獲取不同的權限，

scope的值如下：

在這里插入圖片描述

第一條就是我們的userInfo，當我們看到這里的時候我們就會自認為把代碼改成如下應該就可以了：

Taro.getSetting({
  success: function (res) {
    if (!res.authSetting['scope.userInfo']) {
      Taro.authorize({
        scope: 'scope.userInfo',
        success: function () {
            Taro.getUserInfo()
        }
      })
    }
  }
})

但是當我們改成這玩意的時候，我們會發現報錯了，在微信控制臺出現一些看不懂的錯誤，而且并不會彈出授權視窗，到這一步我花費了一段時間在網上找，但是并沒有發現滿意的答案，最后在微信小程式的檔案中發現了這樣一段話：

在這里插入圖片描述

看到這里心態都崩了，搞了半天居然說不支持，然后發現這種方式有一個缺點，只能通過點擊來彈出授權視窗，因此就有如下代碼：

<AtButton  openType={"getUserInfo"} onGetUserInfo={handleBtn}>注冊</AtButton>

const handleBtn = (e) => {
    console.log(e)  // e.detail.userInfo 這個就有我們的用戶資訊
}

在我們Taro中的按鈕可以系結上述屬性來獲取userInfo，<Button></Button>和<AtButton></AtButton>中都可以有這兩個屬性，

以下為嘗試內容（并沒有成功）

在這里我還沒有死心，想能不能通過不點擊按鈕的方式獲取到微信小程式的用戶資訊，然后我又想到了微信原生組件里面有open-data這個組件，他們能顯示出來用戶資訊，那我能不能通過獲取到這個dom，拿到里面的value，后來翻Taro的檔案，再組件中找到了這個組件<OpenData>

在這里插入圖片描述

這個是這個組件中屬性type的取值，然后我分別嘗試了一下userNickName和userAvatarUrl但是從獲取到的dom里面并沒有發現它們的value值，然后在網上查了一下原因，微信小程式對資料做了處理，只能看見，拿不到的，這說明他們這方面做的還是很棒的，

總結

對于這次的bug經歷還是很有識訓的，對這個檔案的了解更多了一些，對于檔案里面一些小字兒一定要格外注意，要不就有可能遇到這種類似的情況，

轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/241354.html

標籤：其他

上一篇：專案1——博客系統

下一篇：Vant修改主體顏色樣式