Как войти в систему с учетными данными Apple и Google в react-native и supabase

Question

Я пытаюсь реализовать вход с помощью google и apple, используя следующие библиотеки и supabase в простых проектах, связанных с реакцией.

• реагировать-родной-яблочной аутентификации

• реагировать-родной-google-signin

Они очень хорошо работают с firebase, как описано с использованием firebase sdk. Концепция довольно проста: собственный sdk для подписи Apple и Google возвращает учетные данные пользователя после успешного входа в систему. Вот пример из здесь,https://rnfirebase.io/auth/social-auth

С учетными данными google

      import auth from '@react-native-firebase/auth';
import { GoogleSignin } from '@react-native-google-signin/google-signin';

async function onGoogleButtonPress() {
  // Get the users ID token
  const { idToken } = await GoogleSignin.signIn();

  // Create a Google credential with the token
  const googleCredential = auth.GoogleAuthProvider.credential(idToken);

  // Sign-in the user with the credential
  return auth().signInWithCredential(googleCredential);
}

С учетными данными Apple

      import auth from '@react-native-firebase/auth';
import { appleAuth } from '@invertase/react-native-apple-authentication';

async function onAppleButtonPress() {
  // Start the sign-in request
  const appleAuthRequestResponse = await appleAuth.performRequest({
    requestedOperation: appleAuth.Operation.LOGIN,
    requestedScopes: [appleAuth.Scope.EMAIL, appleAuth.Scope.FULL_NAME],
  });

  // Ensure Apple returned a user identityToken
  if (!appleAuthRequestResponse.identityToken) {
    throw 'Apple Sign-In failed - no identify token returned';
  }

  // Create a Firebase credential from the response
  const { identityToken, nonce } = appleAuthRequestResponse;
  const appleCredential = auth.AppleAuthProvider.credential(identityToken, nonce);

  // Sign the user in with the credential
  return auth().signInWithCredential(appleCredential);
}

Я прошел через аутентификацию, предоставленную supabase здесь supabase-js auth Самое близкое, что я могу найти, связанное с приведенной выше реализацией, - это использование токена обновления, как показано здесь Войдите в систему, используя токен обновления

      // An example using Expo's `AuthSession`
const redirectUri = AuthSession.makeRedirectUri({ useProxy: false });
const provider = 'google';

AuthSession.startAsync({
  authUrl: `https://MYSUPABASEAPP.supabase.co/auth/v1/authorize?provider=${provider}&redirect_to=${redirectUri}`,
  returnUrl: redirectUri,
}).then(async (response: any) => {
  if (!response) return;
  const { user, session, error } = await supabase.auth.signIn({
    refreshToken: response.params?.refresh_token,
  });
});

В приведенном выше примере используется refreshToken параметр auth.sign () для создания сеанса для пользователя , который уже зарегистрирован.

Поправьте меня, если ошибаюсь. Согласно документации auth не существует метода, позволяющего создать пользователя с использованием учетных данных auth. Это связано с тем, как реализована gotrue social auth. Единственное решение, которое я могу придумать сейчас, - это переместить всю логику аутентификации на бэкэнд и обрабатывать ее в Интернете. Это совсем не изящно, поскольку для использования сеанса supabase и токена доступа придется использовать уродливые реализации глубоких ссылок или веб-просмотра.

Учитывая приведенный выше сценарий, есть ли способ использовать собственный социальный sdk в react-native для создания новой учетной записи пользователя в supabase с использованием учетных данных пользователя без необходимости заставлять их использовать ссылку электронной почты, пароль или Интернет? Любые идеи, ответы или исправления приветствуются.

Answer 1

На момент написания вход в систему с использованием сторонних учетных данных еще не реализован в gotrue (модуль, используемый для аутентификации в supabase). Если у вас есть собственное приложение, приложение Flutter и приложение с поддержкой реакции, которому требуется социальная аутентификация с использованием учетных данных, следуйте этому WIP:PR. Для получения дополнительной информации см. Пробный ключ для обмена кодами (PKCE).