введение
Мне задали этот вопрос в августе этого года, и я был ошарашен.Когда интервьюер задал этот вопрос, я тут же на него ответил. Интервьюер улыбнулся: это вопрос дизайна, если бы вы уже знали его, я бы не просил вас его разрабатывать.
Я: (горько улыбаясь...) Я обсуждал это с интервьюером с трехдюймовым языком, и я был полон уверенности после разговора, но в конце концов я получил официальное благодарственное письмо наотмашь.
В это время интервьюер спросил, не хотите ли вы еще что-нибудь спросить у меня? Я задал этот вопрос, и интервьюер ответил, что вы на самом деле немного догадались, но не поняли той логики, которую я хотел, и тогда я немного навел ее, сказав, что я могу научиться этому позже, их довольно много. люди обсуждают.
До сегодняшнего дня, после того, как я получил "новое" благодарственное письмо, я вдруг вспомнил этот вопрос. Подумав над этим, я не могу просто игнорировать этот вопрос навсегда. Давайте обсудим его вместе.
Если это поможет вам, пожалуйстаОдна кнопка три ссылки, Конечно, если в этой статье есть какие-либо проблемы, читатели могут меня поправить, это также процесс обучения, спасибо~
Основные технические принципы
На что похожа функция входа в систему с помощью скан-кода?
Большинство мобильных телефонов теперь оснащены таким программным обеспечением, как WeChat, QQ и Taobao. И у этих приложений есть соответствующие веб-страницы. Чтобы пользователям было удобнее и безопаснее входить в систему при использовании своих веб-страниц, естественно использовать мобильный телефон для сканирования и входа в службу.
Эффект интерфейса при сканировании кода для входа выглядит следующим образом:
Итак, проблема возникает в это время: когда мы посещаем определенную веб-страницу, почему этот QR-код появляется на этой веб-странице? Как с помощью этого QR-кода узнать, был ли он отсканирован мной или кем-то другим? так удивительно! После интервью у меня возник вопрос, на который мы по порядку ответим ниже.
Как появился QR-код?
Прежде всего, когда пользователь открывает домашнюю страницу входа на веб-сайт, браузер отправляет запрос на соответствующий веб-сервер.Вход QR-кодзапрос, после того как сервер получит запрос, он случайным образом сгенерируетuuid, положи этоuuidОн хранится на сервере Redis в качестве значения ключа, и в то же время устанавливается время истечения срока действия.По истечении этого срока пользователю необходимо обновить QR-код, чтобы получить его снова.
В то же время объедините это значение ключа со строкой подтверждения компании и сгенерируйте изображение QR-кода через интерфейс генерации QR-кода. Затем изображение QR-кода иuuidвместе возвращаются в браузер пользователя.
Например, для страницы входа (я открыл адрес входа WeChat Likou) мы обычно открывали инструменты разработчика браузера, и я обнаружил, что, когда я застрял на странице входа на некоторое время (около 30 секунд)), запрос ссылка будет постоянно меняться, как показано на следующем рисунке:
есть полеuuid, который увеличивается по мере обновления ссылки. Это хорошее объяснение вышеизложенного, серверная сторона пропустит этоuuidВызовите соответствующий интерфейс, чтобы вернуть QR-код в браузер.
Итак, кто сгенерировал QR-код? Не волнуйтесь, продолжайте анализировать:
-
Когда пользователь открывает веб-сайт, фон веб-сайта основан на WeChat.
OAuth2.0Протокол запрашивает у платформы разработки WeChat авторизацию входа и передает предварительно утвержденную информацию на платформу разработки WeChat.AppIDиAppSecrectи т.д. параметры -
Платформа разработки WeChat проверяет такие параметры, как AppID, и возвращает QR-код на задний план веб-сайта.
-
Серверная часть веб-сайта передает QR-код на переднюю часть веб-сайта для отображения.
Выяснилось, что есть еще участие платформы разработки WeChat, которая генерирует наш QR-код, ОК, продолжаем думать над следующим вопросом.
Как я узнаю, что отсканировал этот QR-код?
Выше мы узнали о генерации QR-кодов, и мыuuidХранится на сервере Redis как значение ключа, тогда только этоkeyЗначение, откуда берется информация о пользователе? С этой мыслью продолжим дискуссию.
Мы получили QR-код веб-страницы выше. Теперь пришло время пользователю отсканировать QR-код. Когда пользователь достает мобильный телефон и сканирует QR-код, он может получить информацию для проверки и QR-код.uuid. Поскольку мобильный терминал уже вошел в систему, при доступе к серверу на мобильном терминале маркер пользователя будет передан в параметрах, и сервер мобильного терминала может преобразовать его в маркер пользователя.userId(Идентификатор пользователя берется из токена, а не передается напрямую с мобильного терминала в целях безопасности. Прямая передача идентификатора пользователя может быть перехвачена и изменена. Токен зашифрован, и риск модификации будет намного меньше).
Мобильный терминал привязывает проанализированные данные к учетной записи WeChat и отправляет их на платформу разработки WeChat.Аутентификация входаЗапрос, платформа разработки WeChat проверяет данные привязки, вызывает интерфейс обратного вызова в фоновом режиме веб-сайта и отправляет временный билет авторизации.code, если авторизация прошла успешно, вернуть на мобильный терминал подтверждающее сообщение.
После того, как мобильный терминал получит возврат, онОкно подтверждения входаОтобразите его для пользователя (чтобы предотвратить неправильные действия пользователя и сделать вход в систему более удобным для пользователя). После того, как пользователь подтвердит, что операция входа выполнена, мобильный телефон снова отправляет запрос. сервер получаетuuIdиuserIdЗадний,Сохраните идентификатор пользователя как значение в паре ключ-значение с uuid в качестве ключа в redis.
- Код получен в фоновом режиме веб-сайта, что указывает на то, что платформа разработки WeChat согласна с запросом данных.
- Фон веб-сайта запрашивает платформу разработки WeChat в обмен на параметры кода, а также AppID и AppSecret.
access_token - Платформа разработки WeChat проверяет параметры и возвращает
access_token - Фон веб-сайта получен
access_tokenПосле этого можно выполнить анализ параметров для получения данных учетной записи пользователя.
Здесь мы получаем актуальную информацию о пользователе.
- AppID: уникальный идентификатор приложения, полученный после того, как приложение отправлено и одобрено открытой платформой WeChat.
- AppSecret: ключ приложения, полученный после отправки приложения на открытую платформу WeChat для рассмотрения и утверждения.
- код: Временный билет авторизации, который необходим, когда третье лицо получает access_token через код. Период ожидания кода составляет 10 минут. Код можно успешно обменять только на один access_token, и он будет недействителен. Временный и одноразовый характер кода гарантирует безопасность авторизованного входа в WeChat.
- access_token: пользователь разрешает стороннему приложению инициировать учетные данные вызова интерфейса.
Весь процесс начинается с того, что серверная часть веб-сайта запрашивает авторизованный вход в систему с платформы разработки WeChat, и конечной целью является получениеaccess_token.
получивaccess_tokenПосле этого вы можете разобрать некоторую базовую информацию о пользователе, включая аватар, имя пользователя, пол, город и т.д. Таким образом, весь процесс сканирования и входа в систему WeChat завершен.
Вся схема процесса
Ссылка в этой статье
Хладнокровный блог: Анализ принципа входа в WeChat скан-кодом
Что произошло за несколько секунд входа в систему через скан-код WeChat?
Спасибо за статью выше, уважаю результаты труда, и настоящим предлагаю оригинальную ссылку.
Наконец
Вывод статей не из легких, надеюсь вы поддержите волну!
Прошлые выборы:
Обратите внимание на склад передней части маленького льва
Друзья могут отправлять свой собственный код решения проблем в задачах, 🤝 Добро пожаловать в раздел «Участие», вы можете зарегистрироваться и решить проблему, Поставьте ⭐️, если этот проект вам помог!
Посетите блог Чаои, друзьям удобно читать и играть~
学如逆水行舟，不进则退