[larvaexotech]

#javascript #webdev #nodejs

Wykopki, mam pytanko. Mam aplikację SPA która działa niezależnie od backendu, tzn. pobiera sobie tylko dane z api.

Problem jest tego rodzaju że mam pewną sytuację w ktorej muszę przejść na prawdziwą podstronę API (logowanie oauth do serwisu społecznościowego). Tzn. user kliknie w guzik logowania i ja wykonuje wtedy window.location.href = 'http://spolczenosciowka.com/login/?redirectuUrl=http://moj-backend.com/on-auth'; użytkownikowi pojawia się stronka społecznościówki z logowaniem , uprawnieniami , "czy wyrażasz" i po akceptacji przekierwouje usera na stronę:

http://moj-backend.com/on-auth?token=xyzabcdefghi ; ta strona robi czynności związane z rejestracją, pobraniem danych użytkwonika z tej społecznościówki i redirectuje go z powrotem na index.html czyli entry point mojej aplikacji SPA.

Problem polega na tym że powracając do tego index.html muszę wepchnąć tam dane odnośnie konta użytkownika w moim serwisie, tzn. jakiś tam autoryzacyjny token do konta żebym mógł wiedzieć że "on" to "on".

Pytanie brzmi, w jaki sposób to przekazać? Index.html to statyczny plik z układem i javascriptami frameworka SPA a muszę jakoś tam "wrzucić" access token. Jedyne na co wpadłem to żeby przekazać to przez query string, tj.

http://moj-backend.com/index.html?accessToken=qqqqqqqq , i potem po stronie frontendu sparsować URI i sprawdzić czy jest taki parametr query stringa jak 'accessToken'. Ale to rozwiązanie mi się nie podoba, takie doklejanie tokena do paska adresu, więc zapytam może znacie jakieś inne bezbolesne możliwości uczynienia tego?

[epi]

@larvaexotech: a dlaczego logowanie wymaga osobnej strony, zamiast też być dostępne przez api?

[larvaexotech]

@epi: właśnie o to chodzi że logowanie "klasyczne" typu email/haslo to banał bo po prostu do api puszczam te dane a api zwraca mi jakiśtam access token.

ale tutaj mam do czynienia z logowaniem przez serwis społecznościowy (np. facebook, twitter, instagram, g+) i tam logowanei polega na tym że przekierowujesz usera na strone tej społecznościówki z jakimś specjalnym adresem i w URI podajesz url zwrotny. jak użytkownik się zaloguje to społecznościówka

[larvaexotech]

@epi: nie wiem czy nie zakręciłem, sprawa wygląda tak:

1. user wchodzi na http://moj-backend.com/index.html

2. przechodzi do ekranu logowania (podstrona client-side): http://moj-backend.com/#!/logowanie

3. klika w guzik, zostaje przekierowany do: http://serwis-spolecznosciowy.com/oauth/?redirectUrl=http://moj-backend.com/on-auth

4. klika w społecznościówce "zaloguj się" i zostaje zawrócony do: http://moj-backend.com/on-auth?token=xxxxx

6. moja aplikacja backendowa na podstawie przekazanego tokena pobiera dane użytkownika z tego serwisu społecznościowego, rejestruje lokalne konto na podstawie tych danych, generuje dla tego lokalnego konta token autoryzacyjny do

[epi]

@larvaexotech: może obczaj jakiś zewnętrzny serwis do autentykacji, zamiast wbijac bezpośrednio?
np: https://www.firebase.com/docs/web/guide/user-auth.html

[M4ks]

więc zapytam może znacie jakieś inne bezbolesne możliwości uczynienia tego?

@larvaexotech: u mnie zawsze wiazalo sie to z utworzeniem sesji na serwerze (i zdaje sie bez tego oauth raczej ciezko...) - wiec zwyczajnie na poczatku SPA odpytywalo sie endpoint o dane z sesji i tyle

[larvaexotech]

@M4ks: No cóż z sesjami faktycznie siadło aczkolwiek jakoś tak super mi to rozwiązanie nie odpowiada nie wiem czemu :) Dzięki tak czy inaczej ( ͡° ͜ʖ ͡°)

[M4ks]

@larvaexotech: całe oauth opiera sie na sesjach wiec cięzko coś innego...

[dikamilo]

@larvaexotech: Nie rozumiem potrzeby przekierowania na backend, zrób wszystko po stronie frontendu, społecznościówki mają do tego api/sdk. Jak używasz angulara albo czegoś innego to na 100% jest do tego już biblioteka, service czy co innego. W metodach dostajesz token który potem możesz przekazać do backendu albo wyciągnąć dodatkowe dane i dopiero wtedy przekazać do backendu.

https://developers.facebook.com/docs/facebook-login/web

[larvaexotech]

@dikamilo: chodzi o Instagrama i tam zalecają jednak żeby przez backend to robić więc robie to zgodnie z zaleceniami :P

pozatym kiedyś jak integrowałem FB to mam przykre doświadczenia z javascriptową autoryzacją na urządzeniach mobilnych (na 3 telefony z androidem i tą samą przeglądarką na dwóch popup nie działao a na jednym działał).