Мини-программа (2): Войдите, чтобы получить информацию о пользователе

Апплет WeChat

Вход в систему и получение информации о пользователе — самые основные двухэтапные операции в апплете, однако из-за недостатков дизайна официального запуска апплета многие разработчики связали вход и получение информации о пользователе, хотя интерфейс wx.getUserInfo апплета был позже использован. С поправкой на: При вызове этого интерфейса без авторизации пользователя больше не будет появляться всплывающее окно авторизации, и будет введен прямой обратный вызов. Однако после изменения многие разработчики все еще сбиты с толку. о концепциях этих двух шагов В следующей статье будет подробно рассказано о двухэтапной работе апплета.

Авторизоваться

wx.login() используется для входа в систему. Интерфейс вызывается для получения учетных данных для входа. Код отправляется на серверную часть для замены данных session_key и openid. Далее, давайте посмотрим, как выглядит весь процесс входа в апплет:

Это официальная блок-схема входа в апплет Теперь давайте интерпретируем этот процесс.

  • Интерфейсная часть wx.login() получает код, вызывает внутренний интерфейс и отправляет полученный код на серверную часть.
  • Бэкэнд вызывает сервис интерфейса WeChat, отправляет его с appid+appsecret+code и заменяет на session_key+openid.Раньше unionid нельзя было заменить, но теперь его можно заменить на unionid при выполнении следующих условий
  1. На открытой платформе WeChat есть приложения, официальные аккаунты и небольшие программы с той же тематикой.
  2. Пользователь подписался на общедоступную учетную запись того же субъекта или выполнил авторизацию входа в WeChat в приложении или официальной учетной записи того же субъекта. В то же время, если выполняются два вышеуказанных условия, можно получить unionid пользователя, чтобы можно было точно идентифицировать пользователя в wx.login().
  • Пользовательское состояние входа связано с openid и session_key, фактически токен, связанный с openid и session_key, генерируется и отправляется во внешний интерфейс.
  • Внешний интерфейс сохраняет токен, выданный серверной частью, в кеше и переносит настраиваемый статус входа в последующие запросы интерфейса.

Выше показан весь процесс входа в апплет.Видно, что wx.getUserInfo() не требуется для получения информации о пользователе.При определенных условиях unionId также можно получить с помощью вызова wx.login(). Получить информацию о пользователе из базы данных

Получить информацию о пользователе

Когда ранее вызывался wx.getUserInfo(), появлялось всплывающее окно авторизации и вводилась соответствующая функция обратного вызова в зависимости от того, авторизован пользователь или нет.Однако позже WeChat обнаружил, что разработчик злоупотребил методом wx.getUserInfo(), и апплет не может быть использован без авторизованной информации о пользователе. , теперь вы можете вызвать всплывающее окно авторизации только через компонент кнопки open-type="getUserInfo". После авторизации вы можете получить информацию о пользователе и зашифрованные данные информация о пользователе и отправка зашифрованных данных информации о пользователе на серверную часть, а серверная часть передает wx.login Session_key, замененный кодом (), может расшифровать зашифрованные данные, чтобы получить полную информацию о пользователе.Этот шаг на самом деле дополнение к первому шагу. Он будет выполняться только в том случае, если wx.login() не может подтвердить пользователя. На первом шаге, если wx.login() может подтвердить информацию о пользователе, этот шаг можно опустить, чтобы реализовать нечувствительные данные пользователя. авторизоваться.
Примечание: Согласно официальным документам, недавно выпущенным мини-программой, мини-программа не может открывать окно входа в систему, когда пользователь входит в мини-программу, чтобы попросить пользователя войти в систему, чтобы испытать мини-программу. отклонено, и пользователю необходимо испытать определенную мини-программу. После того, как функция включена, пользователи могут войти в систему с информацией об авторизованном пользователе.адрес документа

Срок действия токена истек, повторите вход

В прошлом, когда мы писали веб-приложения, когда токен, отправленный серверной частью, был недействителен, интерфейс запроса получал код ошибки 403, а затем, когда интерфейс получал возвращенный код ошибки, он переходил к страницу входа и попросить пользователя снова войти в систему, но когда апплет Когда срок действия токена истекает, мне нужно перейти на страницу входа, чтобы снова войти в систему? Очевидно, в этом нет необходимости, потому что у самого апплета нет учетной записи и пароля для входа в систему, поэтому, если вход не удался, просто выполните бессмысленную операцию повторного входа, если только какой-нибудь апплет не полагается на информацию для входа в WeChat, но имеет свою собственная встроенная информация для входа пользователя в апплет, вам нужно перейти на страницу входа, чтобы повторно войти в систему, но есть еще несколько небольших программ, подобных этой.
Просто посмотрите на код:

const Fly = require('../libs/flyio')
const fly = new Fly()
const newFly = new Fly()
let time = 0
let baseUrl = 'xxxxx'
fly.interceptors.request.use((request) => {
  wx.showNavigationBarLoading()
  request.headers['token'] = wx.getStorageSync('token')
  request.baseURL = baseUrl
  return request
})
newFly.interceptors.request.use((request) => {
  wx.showNavigationBarLoading()
  request.headers['token'] = wx.getStorageSync('token')
  request.baseURL = baseUrl
  return request
})
fly.interceptors.response.use(
  (response, promise) => {
    wx.hideNavigationBarLoading()
    return promise.resolve(response.data)
  },
  function (err, promise) {
    wx.hideNavigationBarLoading()
    // session或者session_key失效的时候重新登录
    if (err.status === 403) {
      //锁定当前实例，后续请求会在拦截器外排队
      this.lock()
      // 当出现未认证的情况时重新登录,超过三次抛出错误
      if (time > 3) {
        time = 0
        return promise.reject(err.message + `(${err.status})`)
      }
      return new Promise((resolve, reject) => {
        wx.login({
          success: (e) => {
            let options = {
              'code': e.code
            }
            resolve(options)
          }
        })
      }).then((options) => {
        return newFly.post('/login', options).then(info => {
          wx.setStorageSync('token', info.token)
          time++
          //解锁后，会继续发起请求队列中的任务
          this.unlock()
          // 重新请求失败的请求
          return fly.request(err.request)
        })
      })
    }
  }
)

export {
  fly
}

В приведенном выше коде показан процесс перерегистрации токена апплета после истечения срока действия.Кода не так много, а ключевые места так же закомментированы, что легко понять.Самое главное здесь - использоватьflyioЭта библиотека сетевых запросов использует эту библиотеку для повторной регистрации с истекшим сроком действия. Это мощная библиотека HTTP-запросов на основе Promise, которая поддерживает несколько сред выполнения JavaScript. Приложения Weex, Node, React Native и Quick могут работать в обычном режиме. Очень удобно используйте эту библиотеку в небольших программах. Чтобы избежать бесконечного цикла, этот код использует счетчик. Если он превышает три раза, повторная попытка входа не будет выполнена, а сразу будет выдано сообщение об ошибке.

Суммировать

В этой статье в основном представлен процесс входа в апплет, получение информации о пользователе и связанное с ним содержание входа в систему с истекшим сроком действия и повторный вход.Это только основной общий процесс.На самом деле, бизнес каждого апплета может быть разным. Следовательно, в конкретном приложении необходимо настроить его в соответствии с конкретным бизнесом.
Если есть ошибки или неточности, прошу покритиковать и поправить, если хотите, добро пожаловать на лайк

Категории