如何在 cordova 應用程序上實現沒有 googleplus 插件的 Google OAuth 登錄？

Question

我正在嘗試將 Google OAuth 用於我的應用程序。 由於我有不使用 Google Plus 插件或任何其他類似插件的限制，我在 iOS（Cordova 應用程序，離子）上嘗試了如下手動過程。

我使用應用內瀏覽器插件，單擊按鈕打開谷歌 OAuth URL 使用應用in-appbrowser瀏覽器目標作為safari瀏覽器上的 _system。

https://accounts.google.com/o/oauth2/v2/auth?
 scope=email%20profile&
 response_type=code&
 state=security_token%3D138r5719ru3e1%26url%3Dhttps%3A%2F%2Foauth2.example.com%2Ftoken&
 redirect_uri=**reverse_client_id**%3A/oauth2redirect&
 client_id=***

輸入所需的詳細信息（用戶名、密碼）后，谷歌登錄屏幕出現，它重定向到我的應用程序

問題是當它重定向回來時，它沒有調用頁面（角度路由），應用程序仍然是理想的。 [重定向路徑：/oauth2]

如何處理重定向？

Answer 1

我找到了幾個解決方案

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 具有可用於獲取access token的code 。

Answer 2

要在 Angular 中使用 google 登錄，您必須按照給定的步驟操作：

1. 在谷歌雲控制台平台創建谷歌應用並生成客戶端ID。
2. 創建一個新的 angular 應用程序。
3. 使用 google OAuth 2.0 協議實現與 google 的登錄。

您可以閱讀我在 Codingvila Angular 14 Login with Google using OAuth 2.0上寫的文章，其中我通過示例逐步解釋了所有內容。

您還可以下載示例示例以進行練習。