1

I've used this repository https://github.com/jeroenheijmans/sample-angular-oauth2-oidc-with-auth-guards/ as a test and switched the authConfig settings to a Google app I created. The code flow works except it always tries to exchange the authorization code for refresh and access tokens which fails because Google requires the client secret for that.

What I'm trying to do is intercept the authorization response which includes the code and state, and send that to my back-end REST API. The API will get refresh and access tokens using the authorization code (and client secret), store the refresh token in our DB, and send the access token back to the UI. I can't find any way of intercepting the process using the angular-oauth2-oidc package. Any suggestions?

user1630508
  • 91
  • 2
  • 5
  • Careful though! You're explicitly stepping _outside_ the standardized Code Flow, and more into a "Backend For Frontend" style setup. You'd reduce the attack vectors of your setup if you then completely cut out the browser as a place that sees powerful things like a `code` or similar. – Jeroen Mar 23 '23 at 23:36
  • @Jeroen Is there another way? Our server needs a refresh token to make API calls. The only way you can authorize an app is through a web browser. – user1630508 Mar 24 '23 at 01:18
  • What you describe _sounds_ to me like that "BFF" flow, see for example [Auth0's description of it](https://auth0.com/blog/backend-for-frontend-pattern-with-auth0-and-dotnet/#About-the-Login-Flow). - The main thing I wanted to warn about is that the Angular library you mention (which my sample you linked also uses) is in my experience _not_ good at supporting the scenario you described with tokens also on the server like that. I'd expect it to be a struggle and would at least recommend another client side lib, if not a different flor or setup like BFF. Hope that helps! – Jeroen Mar 24 '23 at 09:42

1 Answers1

1

you can create your own http interceptor. Just be sure that it's declared before oauth2 module.

Here is the link to the angular's doc regarding http interceptors order: https://angular.io/guide/http#interceptor-order

Alternatively you can redeclare ( create your own implementation ) angular's http request or HttpClient service, or even HttpClientModule.

To achieve this you can use "useClass" provider:

[{ provide: HttpClient, useClass: MyHttpClient }]

https://angular.io/guide/dependency-injection-providers

m0rning sun
  • 11
  • 2
  • Note that [the library has its own HttpInterceptor which you can also similarly override](https://manfredsteyer.github.io/angular-oauth2-oidc/docs/additional-documentation/working-with-httpinterceptors.html) if you go the route of this answer. – Jeroen Mar 23 '23 at 23:34