Open Closed

URL Params "code" auto redirect to root page #3956


User avatar
0
aszklarz created
  • ABP Framework version: Version 5.3.4
  • UI type: Angular
  • DB provider: EF Core
  • Tiered (MVC) or Identity Server Separated (Angular): no
  • Exception message and stack trace:
  • Steps to reproduce the issue:
    • I have an angular application and trying to get access tokens from external API to get some resources.
    • I made a button which start authorization code flow,I set query params, with redirect_uri to my page- where the button is. API respone me, but then I get redirection to root page.
    • It seems that the problem is query param "code" in url, bacause when I change its name to something else it works fine. For example, I start code flow, I login in some page, then it redirect me to : http://localhost:4200/somePage?code=123
      and then it redirect me to http://localhost:4200/somePage so my angular app doesnt receive the "code"
    • Could you tell me how can i resolve this problem?

7 Answer(s)
  • User Avatar
    0
    aszklarz created

    Even on yours https://commercial-demo.abp.io/file-management when I change address to https://commercial-demo.abp.io/file-management?code=123 It's redirect me to https://commercial-demo.abp.io/file-management again. Any sugestions?

  • User Avatar
    0
    muhammedaltug created

    Hello,

    Code, state, and session_state query parameters used by angular-oauth2-oidc library. Please use another queryParameter.

    Usage detail

  • User Avatar
    0
    aszklarz created

    Hello,

    Code, state, and session_state query parameters used by angular-oauth2-oidc library. Please use another queryParameter.

    Usage detail

    Hi, atm I'm trying to get resource from allegro and amazon, both of them send me back "code" and "state". I don't think "use another queryParameter" is good solution, no one of them will change queryParams for me. Is there any other(maybe abp build in) method to make auhorization code flow, to recieve access + refresh token pair that i can store in db?

  • User Avatar
    0
    muhammedaltug created

    Hello

    Sorry i misunderstood your problem. I am able to reproduce this problem. I will respond to you when i find a solution

  • User Avatar
    0
    muhammedaltug created

    Hello,

    Code parameter deleted automatically by angular-oauth2-oidc library. This problem is not related to the code query parameter by the way.

    Can you follow the steps below to fix this problem?

    • Save redirectUri to local storage before starting the authorization code flow login
        login() {
          this.oAuthService.redirectUri = 'REDIRECT_URI';
          localStorage.setItem('AuthRedirectUri', 'REDIRECT_URI');
          this.authService.navigateToLogin();
        }
      
    • Add the following provider to your AppModule's providers
      @NgModule({
        declarations: [AppComponent],
        imports: [
          //imports
        ],
        providers: [
          APP_ROUTE_PROVIDER,
          {
            provide: APP_INITIALIZER,
            multi: true,
            useValue: () => {
              const redirectUri = localStorage.getItem('AuthRedirectUri');
              if (redirectUri) {
                environment.oAuthConfig.redirectUri = redirectUri;
                localStorage.removeItem('AuthRedirectUri');
              }
            },
          },
        ],
        bootstrap: [AppComponent],
      })
      export class AppModule {}
      
      
  • User Avatar
    0
    aszklarz created

    Hello,

    Code parameter deleted automatically by angular-oauth2-oidc library. This problem is not related to the code query parameter by the way.

    Can you follow the steps below to fix this problem?

    • Save redirectUri to local storage before starting the authorization code flow login
        login() { 
          this.oAuthService.redirectUri = 'REDIRECT_URI'; 
          localStorage.setItem('AuthRedirectUri', 'REDIRECT_URI'); 
          this.authService.navigateToLogin(); 
        } 
      
    • Add the following provider to your AppModule's providers
      @NgModule({ 
        declarations: [AppComponent], 
        imports: [ 
          //imports 
        ], 
        providers: [ 
          APP_ROUTE_PROVIDER, 
          { 
            provide: APP_INITIALIZER, 
            multi: true, 
            useValue: () => { 
              const redirectUri = localStorage.getItem('AuthRedirectUri'); 
              if (redirectUri) { 
                environment.oAuthConfig.redirectUri = redirectUri; 
                localStorage.removeItem('AuthRedirectUri'); 
              } 
            }, 
          }, 
        ], 
        bootstrap: [AppComponent], 
      }) 
      export class AppModule {} 
      
      

    Hey, Thanks for your reply, I try your code but it seems like your answer is not a point of my problem.

    My goal is to get Access token and refresh token, that i can strore on backend and use it when need. Atm i have a button with href that send me to login page. In href I pass parameters that external api need to start code flow ( response_type, redirect_uri etc). This process works fine. I Log in to external API, a then it redirect me to Uri that I pass in redirect_uri parameter. This part works fine too. BUT when api redirect me to redirect_uri it concat it with "code" parameter. For example Redirect_uri I send with href parameter: http://localhost:4200/somePage Redirect that api made: http://localhost:4200/somePage?code=123

    And the point is I want to read this "code" parameter. In ngOnInit I try to listen for it:

        this._route.queryParams.subscribe(params => {
          this.code = params['code'];
          console.log(this.code);
        })
    

    But this code is never reached because something (probably angular-oauth2-oidc library or its implementation) redirect me to http://localhost:4200/somePage.

    So the question is, how to read this code parameter?

  • User Avatar
    0
    muhammedaltug created

    Hello,

    Can you follow gist

Made with ❤️ on ABP v8.2.0-preview Updated on March 25, 2024, 15:11