先到 google 申請 OAuth 用戶端 ID 憑證
![](https://blog.givemin5.com/wp-content/uploads/2021/03/image-2021-03-21_13-50-16_888764.png)
然後到最後一步,取得用戶端 ID 跟密碼
![](https://blog.givemin5.com/wp-content/uploads/2021/03/image-2021-03-21_15-15-13_439709.png)
在 ClientApp 執行 npm 安裝 angularx-social-login ,因為使用了 Angular 8 所以安裝 2.1.1 版本
npm install angularx-social-login@2.1.1 –save
在 app.module.ts 增加 GoogleLoginProvider 等資訊
![](https://blog.givemin5.com/wp-content/uploads/2021/03/image-2021-03-21_15-18-38_056907-1024x315.png)
![](https://blog.givemin5.com/wp-content/uploads/2021/03/image-2021-03-21_15-19-36_057738.png)
在 words.component.ts 加入登錄登出等功能
![](https://blog.givemin5.com/wp-content/uploads/2021/03/image-2021-03-21_15-20-42_418259-1024x619.png)
在頁面上,增加登錄登出等功能
![](https://blog.givemin5.com/wp-content/uploads/2021/03/image-2021-03-21_15-21-57_159154.png)
執行結果
![](https://blog.givemin5.com/wp-content/uploads/2021/03/image-2021-03-21_15-22-29_147205.png)