2016-05-20 42 views
19
  • Nie mogłem znaleźć żadnych odpowiedzi związanych z działającym mechanizmem skanowania kodu QR używanego na Whatsapp web-app.
  • W jaki sposób uwierzytelnianie ma miejsce, gdy telefon (dowolny smartfon z systemem WhatsApp) skanuje kod QR w przeglądarce.
  • Nie chcę o stosu technologicznego za them.Like WhatsApp używa zmodyfikowanej wersji xmpp, wykorzystuje erlang, korzysta z technologii internetowych, takich jak socket.io i ajax dla wersji internetowej, aby zaimplementować taką funkcjonalność.
  • Pytanie może być szeroka.Ale jestem chętny, aby dowiedzieć się o realizacji za nim.

Odpowiedz

2

Używa czegoś takiego jak poniżej.

  1. Aplikacja internetowa Whatsapp jest otwierana przez użytkownika za pomocą przeglądarki internetowej.
  2. Serwer tworzy UNIKALNY token (numer) i umieszcza go w QR-Code
  3. Aplikacja telefonu Whatsapp odczytuje kod QR i dekoduje token.
  4. Aplikacja telefoniczna Whatsapp wysyła informacje o swoim aktualnym użytkowniku i nowo odczytanym tokenie na serwer WhatsApp.
  5. Serwer Whatsapp dopasowuje token (informacje o użytkownikach aplikacji telefonu) za pomocą przeglądarki internetowej.
  6. Automatycznie uwierzytelnia użytkownika i otwiera nową stronę internetową z jego informacjami na jej temat.
+0

Na przykład, jeśli tysiące tokenów są generowane przez serwer, gdy każdy użytkownik otwiera witrynę web.whatsapp.com. Jak HTTP są bezstanowe. Jak serwer inicjuje i znajduje okno przeglądarki danego użytkownika powiązane z tym konkretnym tokenem . –

+0

@dewnor, jak przepełnienie stosu odróżnia ciebie od ciebie. To jest podobne, każdy z nas ma inne tokeny. –

+0

To prawda, gdy użytkownik bezpośrednio wchodzi w interakcję z przeglądarką (ładunki formularzy -> użytkownik wprowadza poświadczenia -> naciska przycisk logowania -> zostaje przekierowany na pulpit). Ale tutaj renderowany jest tylko kod QR, a następnie następuje interakcja między telefonem a serwerem. Po uwierzytelnieniu na serwerze bez interakcji użytkownika z przeglądarką. Przeglądarka jest przekierowywana do pulpitu nawigacyjnego. –

20

To działa tak:

1- otworzyć następujący adres URL w przeglądarce: https://web.whatsapp.com/

2- Przeglądarka ładuje stronę ze wszystkimi rodzajami JS i CSS rzeczy, ale otwiera również websocket (WSS: //w4.web.whatsapp.com/ws) - Sprawdzić to zdjęcie:

enter image description here

2.1- Co 20000 milisekund można zobaczyć ruch na websocket AR efresh na kodzie QR, który masz na swoim ekranie. To jest wysyłane przez serwer do przeglądarki, bezpo¶rednio websocket (WS nazywamy go od teraz)

enter image description here

2.2- Na każdym QR Code odświeżania otrzymanych na WS Twoja przeglądarka ma żądania GET dla nowy kod QR w kodowaniu BASE64.

2.3 - Zauważ, że ten specyficzny WS, który serwer otworzył między Serwerem a Przeglądarką, jest powiązany z unikalnym kodem QR !!! Znając kod QR, serwer wie, który WS jest z nim powiązany!

---- Na tym etapie Twoja przeglądarka jest gotowa do pracy z aplikacją WhatsApp, ale nie wie, jaki jest Twój identyfikator (identyfikator Whatsapp, który jest numerem telefonu komórkowego), ponieważ nie może naprawdę dostarczyć numeru telefonu z cienkiego powietrza.

Nie wymaga również wpisywania, ponieważ serwer nie byłby pewny, czy dany numer naprawdę należy do Ciebie.

Więc niech Serwery wiedzieć, że sesja WS należący do konkretnego telefonu, trzeba używać telefonu do czytania QR

3- można chwycić telefon, który jest uwierzytelnione (inaczej nie byłoby mieć dostęp do sekcji, aby skanować kody QR) i zrobić kod QR czytający rzecz:

4- Kiedy twój telefon odczytuje kod QR, kontaktuje się z serwerami WhatsApp i mówi im: Mój numer to XXXX, Moje autoryzacje są YYYYY i WS powiązane z tym kodem QR mogą teraz otrzymywać moje dane DATA

5- Serwer wie, że może kierować T raffic do określonego gniazda WS, które należy do tego kodu QR, i robi to!

6- W przeglądarce WS możesz zobaczyć serwer przesyłający dane dotyczące użytkownika, dotyczące rozmów, które posiadasz oraz miniatur zdjęć do zrobienia i chwycić.

enter image description here

7- Przeglądarka pobiera te dane z websocket i sprawia, że ​​odpowiednie wnioski dostać się dostać kciuki i innych zasobów potrzebuje, jak MP3 do kierowania zawiadomień

7.1 - WS detektor w przeglądarce wykonuje również wywołania JavaScript, w plikach javascript, które zostały odebrane w kroku 1, aby przerysować stronę DOM z nowym interfejsem.

8- Interfejs jest teraz przerysowany tak, aby wyglądał jak aplikacja WhatsApp, a użytkownik nadal otrzymuje dane na temat WS i wysyła w razie potrzeby, a aktualizacje są wprowadzane do interfejsu, gdy dane docierają do WS.

To wszystko.

Korzystając z Chrome i narzędzi dla programistów, możesz zobaczyć, jak to wszystko dzieje się na żywo. Możesz również zobaczyć komunikację WS (większość z nich, ramki binarne, które potrzebujesz innego narzędzia) i zobaczyć, co się dzieje na wszystkich etapach.

również: