GitHub - jim60105/GoogleOIDC_Angular_ASPNETWebAPI_Auth_Code_Flow at 3bc14ed41594536e11d1bb06a84ec7418ff0ce40



           <script src="https://accounts.google.com/gsi/client" async defer></script>
 {
   "extends": "./tsconfig.json",
   "compilerOptions": {
     "outDir": "./out-tsc/app",
     "types": ["google.accounts"]
   },
   "files": ["src/main.ts", "src/polyfills.ts"],
   "include": ["src/**/*.d.ts"]
 }
 oidcLogin(): void {
   const client: google.accounts.oauth2.CodeClient = google.accounts.oauth2.initCodeClient({
     client_id: environment.clientId,
     scope: 'openid profile email',
     ux_mode: 'redirect',
     redirect_uri: environment.apiUrl + '/api/Auth/oidc/signin',
     state: '12345GG',
   });
   client.requestCode();
 }
 public async Task<IActionResult> SigninOIDCAsync(string code, string state, string? error)
 {
     if (state != "12345GG")
     {
         return BadRequest();
     }

     if (!string.IsNullOrEmpty(error))
     {
         throw new Exception(error);
     }

     string idToken = await _oidcService.GetIdTokenAsync(code);

     return Redirect($"{_config["FrontEndUri"]}?idToken={idToken}");
 }
 public async Task<string> GetIdTokenAsync(string authorization_code)
 {
     using HttpClient client = _httpClientFactory.CreateClient();
     AuthorizationCodeTokenRequest request = new()
     {
         Code = authorization_code,
         RedirectUri = RedirectUri,
         ClientId = ClientId,
         ClientSecret = ClientSecret,
         Scope = "openid profile email"
     };

     TokenResponse responce = await request.ExecuteAsync(client,
                                                         GoogleAuthConsts.OidcTokenUrl,
                                                         new(),
                                                         Google.Apis.Util.SystemClock.Default);

     return responce.IdToken;
 }


           return Redirect($"{_config["FrontEndUri"]}?idToken={idToken}");
 this.route.queryParamMap.subscribe((params: ParamMap) => {
   this.idToken = params.get('idToken') || '';
   if (this.idToken) {
     // 直接解開JWT Token
     this.authenticationService.extractToken(this.idToken).subscribe((res) => {
       this.user = res;
     });

     // 如果需要在前端驗證Token，可以使用這個Google API
     this.authenticationService.verifyToken(this.idToken).subscribe({
       next: (data) => {
         console.log('This is verified by Google', data);
       },
       error: (error) => {
         console.log(error);
       },
     });

     // TODO: 接下來可以將idToken存到localStorage，並且在每次發送API請求時，將idToken放到Authorization Header。後端只要用一樣的方式驗證idToken即可確認身份。
   }
 });


           const { sub: userID, name: userName, id: id, picture, email } = jwtDecode<any>(idToken);
Name		Name	Last commit message	Last commit date
Latest commit History 19 Commits
.github/workflows		.github/workflows
ASPNET_WebAPI		ASPNET_WebAPI
Angular		Angular
.gitattributes		.gitattributes
LICENSE		LICENSE
README.md		README.md
	{
	"extends": "./tsconfig.json",
	"compilerOptions": {
	"outDir": "./out-tsc/app",
	"types": ["google.accounts"]
	},
	"files": ["src/main.ts", "src/polyfills.ts"],
	"include": ["src/*/.d.ts"]
	}
	oidcLogin(): void {
	const client: google.accounts.oauth2.CodeClient = google.accounts.oauth2.initCodeClient({
	client_id: environment.clientId,
	scope: 'openid profile email',
	ux_mode: 'redirect',
	redirect_uri: environment.apiUrl + '/api/Auth/oidc/signin',
	state: '12345GG',
	});
	client.requestCode();
	}
	public async Task<IActionResult> SigninOIDCAsync(string code, string state, string? error)
	{
	if (state != "12345GG")
	{
	return BadRequest();
	}

	if (!string.IsNullOrEmpty(error))
	{
	throw new Exception(error);
	}

	string idToken = await _oidcService.GetIdTokenAsync(code);

	return Redirect($"{_config["FrontEndUri"]}?idToken={idToken}");
	}
	public async Task<string> GetIdTokenAsync(string authorization_code)
	{
	using HttpClient client = _httpClientFactory.CreateClient();
	AuthorizationCodeTokenRequest request = new()
	{
	Code = authorization_code,
	RedirectUri = RedirectUri,
	ClientId = ClientId,
	ClientSecret = ClientSecret,
	Scope = "openid profile email"
	};

	TokenResponse responce = await request.ExecuteAsync(client,
	GoogleAuthConsts.OidcTokenUrl,
	new(),
	Google.Apis.Util.SystemClock.Default);

	return responce.IdToken;
	}
	this.route.queryParamMap.subscribe((params: ParamMap) => {
	this.idToken = params.get('idToken') \|\| '';
	if (this.idToken) {
	// 直接解開JWT Token
	this.authenticationService.extractToken(this.idToken).subscribe((res) => {
	this.user = res;
	});

	// 如果需要在前端驗證Token，可以使用這個Google API
	this.authenticationService.verifyToken(this.idToken).subscribe({
	next: (data) => {
	console.log('This is verified by Google', data);
	},
	error: (error) => {
	console.log(error);
	},
	});

	// TODO: 接下來可以將idToken存到localStorage，並且在每次發送API請求時，將idToken放到Authorization Header。後端只要用一樣的方式驗證idToken即可確認身份。
	}
	});