Как сделать социальную аутентификацию с развязанным бэкэндом и веб-интерфейсом (Passport / Express / React)

Question

Я пытаюсь использовать passportJS / Express backend и JS-интерфейс реагирования для социальной аутентификации. Однако я не уверен, как это сделать.

Я немного прочитал и реализовал социальную аутентификацию, которая возвращает токен JWT, подписанный экспресс-приложением, когда вы вошли в систему с Google Auth. Это позволяет мне получить доступ к защищенным конечным точкам на сервере с помощью Authorization заголовок.

Тем не менее, как можно инициировать это через React, тем более что вызов в Google должен осуществляться напрямую через внешний интерфейс (и, следовательно, внутренний интерфейс не выполняет запуск проверки подлинности с использованием Passport JS)? В частности, как должен выглядеть этот поток, когда и бэкэнд, и фронтэнд отделены друг от друга?

Answer 1

На самом деле, LOL вскоре после публикации, я только что нашел это: https://medium.com/@alexanderleon/implement-social-authentication-with-react-restful-api-9b44f4714fa

Тощий:

• авторизация на стороне клиента через Google
• использовать токен Google и отправить на сервер Express; убедитесь, что токены авторизованы и совпадают
• Если оба совпадения, выдайте токен JWT, который будет использоваться для вызовов Express JS API. Это должно быть сохранено в localStorage.