Handling Google OAuth2 Redirection Differently Between Development and Production in Angular and Nest.js

I try to use angular-oauth2-oidc with google social network and work on development and production. I use nest.js part as the backend. I use docker to build nest.js and angular parts and copy all needed files into ‘public’ folder. The problem is that it works in the different way for development and production.

So, user presses a button and code is executing:

this.oAuthService.configure(googleAuthConfig);
this.oAuthService.loadDiscoveryDocumentAndTryLogin();
this.oAuthService.initLoginFlow();

export const googleAuthConfig: AuthConfig = {
    issuer: 'https://accounts.google.com',
    clientId: MY_CLIENT_ID,
    scope: 'openid profile email',
    clearHashAfterLogin: false,
    strictDiscoveryDocumentValidation: false,
    redirectUri: google_environment.redirectUri,
};

and google_environment.redirectUri is different for development

export const google_environment = {
    production: false,
    redirectUri: 'http://localhost:4200/authorization-checking',
  };

and production

export const google_environment = {
    production: true,
    redirectUri: 'https://my-some-application-pqyo.onrender.com/authorization-checking',
  };

and I set up the same redirect URIs on the google side

I also have route in the app-routing.module on the angular side:

const routes: Routes = [
    { path: 'authorization-checking', component: AuthorizationCheckingComponent },
...

While developing it works. As far as I understand in this case webpack-dev-server intercepts redirecting from google and passes it through angular path.

But in the case of production situation is different and redirect goes to the route processing on nest.js and angular handler does not work

How can I configure redirection to work uniformly in development and production using Angular, Nest.js?

Differentiate the two behind an if that checks some environment variable. Could be the value of $NODE_ENV or the presence of a $RENDER_* variable we set, or something else you find when comparing the two environments.

This is not a problem. I understand how to differentiate development and production modes.

I’m not sure I understand the issue, with a differing URL and the difference that production: true / false entails, it is necessary for you to have a differing path of execution, best performed either by an if block, or perhaps two environment variables if it is only necessary for those two values to differ.

I don’t understand the sentences regarding Angular vs Nest.js processing.

I have different paths for execution, it’s not a problem

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.