OAuth во внешнем интерфейсе или на стороне сервера?

#node.js #reactjs #oauth #passport.js #auth0

#node.js #reactjs #oauth #passport.js #auth0

Вопрос:

У меня есть приложение MERN (react на интерфейсе и node, express и Mongo на серверной части)

Я хочу реализовать вход в систему OAuth для входа пользователей в систему.

Пока что я использую Google api для выполнения автоматической настройки на интерфейсе, а затем отправляю токен на сервер, где я получаю пользователя Google и проверяю базу данных на наличие идентификатора пользователя или создаю нового пользователя и возвращаю jwt для будущей аутентификации.

Теперь я рассматриваю возможность использования passportjs в качестве промежуточного программного обеспечения oauth (в основном потому, что мне нужно иметь больше поставщиков аутентификации, таких как Facebook и т. Д.), Но стоит ли выполнять аутентификацию только на сервере?

Я также рассматриваю возможность использования auth0, который имеет как интерфейсные, так и серверные опции, но также не уверен, какая стратегия лучше.

Любая помощь приветствуется.

Ответ №1:

Недавно я провел несколько ночей с этим. Это мне очень помогло.

Обычно:

  • Клиент загружает и запускает Google gapi script.
  • Требуется согласие пользователя
  • Google отправляет токен
  • Этот токен вы отправляете с сервера в Google и подтверждаете пользователя
 const loginGoogle = async () => {
  const loadGapi = () =>
    new Promise((resolve, reject) => {
      const script = document.createElement('script');
      script.src = 'https://apis.google.com/js/api.js';  //loading gapi Script
      console.log('SCRIPT: ', script);
      script.onload = () => {
        console.log('GAPIS SCRIPT LOADED');
        gapi.load('auth2', () => {
          const auth2 = gapi.auth2.init(options);
          console.log('AUTH2: ', auth2);
          resolve(auth2);
        });
      };
      document.body.appendChild(script);
    });
  const ath2 = await loadGapi();
  const code = await ath2.grantOfflineAccess();
  return PostApi('auth/getgoogletoken', code); // sending to server for further processing
};
  

Дайте мне знать, если я смогу предоставить вам дополнительную информацию, я реализовал это с помощью nginx / node / passport и react во внешнем интерфейсе.