Блог

Я пытаюсь использовать Google OAuth для своего приложения. Поскольку у меня есть ограничения на использование плагина Google Plus или любого другого подобного плагина, я попробовал ручной процесс, как показано ниже, на iOS (приложение Cordova, ionic).

Я использовал плагин для браузера в приложении, при нажатии кнопки открывается URL-адрес Google OAuth, используя in-appbrowser target как _system в браузере Safari.

 https://accounts.google.com/o/oauth2/v2/auth?
 scope=email profileamp;
 response_type=codeamp;
 state=security_token=138r5719ru3e1&url=https://oauth2.example.com/tokenamp;
 redirect_uri=**reverse_client_id**:/oauth2redirectamp;
 client_id=***
 

Появляется экран входа в Google, после ввода необходимых данных (имя пользователя, пароль) он перенаправляется в мое приложение

Проблема в том, что когда он перенаправляет обратно, он не вызывает страницу (угловой маршрут), приложение остается идеальным. [путь перенаправления: /oauth2]

Как обрабатывать перенаправление?

Я нашел пару решений

1. https://github.com/cmgustavo/Custom-URL-scheme#readme
2. https://ionicframework.com/docs/native/deeplinks

У первого плагина есть вызываемый метод handleOpenURL , с помощью которого можно получить код OAuth.

 (window as any).handleOpenURL = (url: string) => {
      setTimeout(function() {
        console.log("handle open url called", url)
      }, 0);
    }
 

URL-адрес, указанный выше, имеет a code , который можно использовать для получения access token .

Чтобы реализовать вход в систему с помощью Google в Angular, вы должны выполнить указанные шаги:

1. Создайте приложение Google в платформе Google Cloud Console и сгенерируйте идентификатор клиента.
2. Создайте новое приложение angular.
3. Реализовать вход в систему с помощью Google, используя протокол Google OAuth 2.0.

Вы можете прочитать мою статью, написанную на Codingvila Angular 14 Login с помощью Google с использованием OAuth 2.0, где я объяснил все шаг за шагом на примере.

Вы также можете загрузить примерный пример для своей практики.