Исследование статуса входа в апплет WeChat

WeChat Апплет WeChat

Оригинальная ссылка:сегмент fault.com/ah/119000001…
Предыдущая: Что нужно знать о разработке мини-программ WeChat

Вход, который используется для почти любого проекта, его важность самоочевидна, но логин небольших программ всегда был головной болью для людей. Здесь я поделился нашей разведкой на логине небольших программ.

После пользовательского апплета игра нужно будет нажать на компоненты, прежде чем они могут вызвать авторизацию POP, данные авторизации, такие как их прозвище аватар

Дружеское напоминание:wx.loginwx.getUserInfo, но обычно мы используемUnionID、encryptedData、iv等信息Заполните полный процесс входа в систему, эта статья в основном фокусируется на этом сценарии

Так что способ вызова API напрямую перед не сработает, поэтому вопрос - где разместить кнопку клика?

  • Поместите его на домашнюю страницу, и вы должны войти в систему, как только войдете в апплет. Это явно очень грубо, и проблема не решена, а напрямую отключит пользователя.Ведь вы же не используете маленькую программу как фоновую систему.Вам нужна авторизация при любом раскладе,и авторизация тоже сначала нужна .
  • Перейдите к странице входа в систему, когда требуется авторизация. Это решает проблему быть вынужденным разрешать, когда разрешение не требуется, но это хорошо?
    • Опыт нехороший, работа прерывается, тем более вся страница не требует авторизации и требует авторизации только в одном месте, например: вы читаете статью, вы глубоко тронуты прочитанным, вы хотите прокомментировать, и ты заканчиваешь писать с несколькими крестиками, вот-вот щёлкнет, блять, прыжок! Прыгать!
    • Еще одна воронка для увеличения оттока пользователей. Также ТМ для входа! Многие пользователи должны так думать
      Затем поместите его прямо на страницу, на которой нужно авторизоваться (разве это не воронка? Многие читатели, должно быть, так думают. Но подумайте о сцене выше, когда вы нажимаете на комментарий, вам просто нужно нажать на всплывающее окно). кнопка входа, и это подделка Тон WeChat напоминает вам, что вам нужно войти в систему, так вы войдете?По крайней мере, вы готовы войти, и это произошло так внезапно, что я не мог контролировать свою руку и щелкнул! Нажмите!)

Но есть проблема с этим подходом

Как вывести кнопку входа на нужную страницу

Многие люди должны думать об этом: если компонент извлечен, как вы можете гарантировать, что этот компонент доступен на нужных страницах? Даже если ты убьешь тысячу по ошибке, ты не сможешь упустить ни одного! Интегрируйте компонент входа в общий родительский компонент и используйте его на каждой странице. Я также рекомендую сделать это, потому что этот общий родительский компонент имеет множество применений, таких как адаптация iPhoneX и т. д.

Подождите, все готово, когда нужно авторизоваться? ХХ, это определенно под вашим контролем. Хм~ Хорошо, давайте посмотрим

Где проверить, требуется ли аутентификация

Когда интерфейс запроса, ах ~ Это наш консенсус

Как пройти аутентификацию

Image text


Но см.session_keyВсе же? ВидетьЧиновник также сказалВсе же

Так вот приходит проблема

Как обеспечить действительность session_key

Как показано выше

  • Чтобы бэкэнд при вызове интерфейсаsession_keyНедействительно, можно использовать только перед каждым вызовомwx.checkSessionПроверьте, работает ли это
  • Так же было обнаружено на практикеwx.checkSeesionОн занимает очень много времени, около 200 мс, поэтому его нельзя использовать перед каждым вызовом интерфейса.wx.checkSessionПроверьте, работает ли это
  • Обратите внимание: ⚠️ интерфейс нельзя просто перезапустить.wx.login, потому что это может привести к сбою других текущих внутренних задач, session_key
    Боже, что мне делать? !
    Благодаря практике и случайным открытиям — официальный пример кода

Узнал: session_key не будет недействителен во время использования апплета, так что вы придумали?

  • Проверяйте действительность перед каждым запросом
  • Сохранить результат проверки валидности
  • По результату Async/AWAIT и результатам вы только что гарантировали, но несколько вызовов. Сначала задайте вопросы: Как вы готовы хранить верификацию? . . . Пусть мысль сначала полетит на некоторое время . . . . . . . . . . . . . . . . . . . . . . . . . . . МЕСТО ХРАНЕНИЯ? Конечно, он недостаточно совершенен, почему? Поскольку Хранилище является постоянным хранилищем, период действия session_key только во время использования апплета, поэтому вам необходимо вручную сбросить статус в конце апплета, чтобы повторно проверить действительность, это в приложении onunload Woolen ткань? нет! Следует знать, что для разработки слишком большого количества программ, то есть существует слишком много способов прекратить использование апплета, вы не можете гарантировать, что все методы вызовут ONUNLOAD, например, пользователь напрямую уничтожит процесс WeChat (на самом деле , так же можно заниматься ОНШОУ в приложении) Что это такое? Напрямую использовать память, с помощью автоматического управления памятью, поэтому итоговый код должен быть таким.
// doRequest.js
let wxSessionValid = null // 微信session_key的有效性
// 带鉴权的请求封装
async function doRequestWithCheckAuth() {
  ...
  if (typeof wxSessionValid !== 'boolean') {
    wxSessionValid = await checkWxSession() // 检查微信session是否有效
  }
  if (!wxSessionValid) {
    await reLogin() // 重新登录
  }
  wxSessionValid = true // 重新登陆后session_key一定有效
  ...
}

Это выглядит более совершенным? хм~

Я не знаю, есть ли студенты, которым не терпится спросить, почему сеанс (настраиваемое состояние входа в систему) на стороне бизнеса не упоминается? Ну, давай поговорим сейчас

Как проверить полную систему сертификации

На самом деле это очень просто, и я не хочу говорить об этом как о части, но поскольку я говорил об этом, должно быть что-то, что я хочу подчеркнуть.

  • Проверка на стороне микроканала session_key не представляет особых проблем, но ее не следует перебрасывать на сервер.

    • А на внешнем интерфейсе нам нужно только проверить действительность двух сессий, любой сбой входа в систему снова, это упреждающая и эффективная операция, ее следует продвигать.

Через

Хорошо, в основном сортировка почти завершена, и кнопка входа вот-вот появится. Это просто, просто вызовите метод упакованного компонента прямо сейчас, бинго, но как насчет того, чтобы нажать «Разрешить»? Как продолжить работу пользователя? Как не прерывать пользовательский опыт? Воспроизведите код reLogin только что

async function reLogin() {
  // 确保有用户信息
  await new Promise(resolve => { // ⚠️注意开头有await!!!
    wx.getSetting({
      success: (res) => {
        // 如果用户没有授权或者没有必要的用户信息
        if (!res.authSetting['scope.userInfo'] || !_.isRealTrue(wx.getStorageSync('userInfoRes').userInfo)) {
          navToLogin(resolve) // 去提示用户点击登录按钮,⚠️注意:并把当前的resolve带过去
        } else {
          resolve() // 静默登录
        }
      }
    })
  })
  return new Promise((resolve) => {
    wx.login({
      success: res => {
        login(res.code).then((jwt) => {
          resolve(jwt) // resolve jwt
        }) // 通过code进行登录
      },
      fail(err) {
        wx.showToast({
          title: err.errMsg,
          icon: 'none',
          duration: 2000
        })
      }
    })
  })
}
function navToLogin(resolve) {
  /* eslint-disable no-undef */
  const pages = getCurrentPages()
  const page = pages[pages.length - 1] // 当前page
  page.openLoginModal(resolve) // 打开登录按钮弹框,并把当前的resolve带过去
}

В комментариях к коду выше есть два ⚠️ Вы видели это? Да, через метод обратного звонка 😂 Когда пользователь соглашается на авторизацию, продолжаем остальную логику, если он будет отклонен, он будет урегулирован для других, если он будет отклонен снова, операция будет прекращена. требуется авторизация, авторизация будет продолжать всплывать.

Если вы не понимаете, пожалуйста, оставьте комментарий и укажите на это, и я сделаю объяснение и исправление. Код будет представлен в следующей статье, полный исходный код будет позже, фреймворк, построенный wepy
Далее: Изучение и краткое изложение инкапсуляции запросов APIСпасибо