Ionic 5, Angular 4 ruote navigator doesn't handle query params

Ionic Framework
1

Hello
This is my first experience with Ionic and Angular.


Ionic:

   Ionic CLI                     : 5.0.1 (/home/gianarb/.nvm/versions/node/v10.15.0/lib/node_modules/ionic)
   Ionic Framework               : @ionic/angular 4.4.0
   @angular-devkit/build-angular : 0.13.9
   @angular-devkit/schematics    : 7.3.9
   @angular/cli                  : 7.3.9
   @ionic/angular-toolkit        : 1.5.1

Cordova:

   Cordova CLI       : 9.0.0 (cordova-lib@9.0.1)
   Cordova Platforms : android 8.0.0, ios 5.0.1
   Cordova Plugins   : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 4.0.1, (and 8 other plugins)

Utility:

   cordova-res : not installed
   native-run  : 0.2.3

System:

   Android SDK Tools : 26.1.1 (/home/gianarb/Android/Sdk)
   NodeJS            : v10.15.0 (/home/gianarb/.nvm/versions/node/v10.15.0/bin/node)
   npm               : 6.4.1
   OS                : Linux 5.1

I have a function inside AppComponent that mokes the handleOpenUrl behavior because I am doing integration with Auth0 and I need to catch the redirect URL from a login page:

  private handleOpenUrl(url: string) {
    let u = new URL(url);
    console.log(url)
    if (u.pathname.includes("logincallback")) {
      this.router.navigate(["/logincallback"], { queryParamsHandling: 'preserve' })
    }
  }

I need to redirect the logincallback to /logincallback keeping with query params that comes from the callback. I debugged and, in that function, I see the query params: this is the URL without sensitive information:

"com.testapp.xxx://dev-auth0.com/cordova/com.testapp.xxx/logincallback?code=-xxxxx&state=xxxxxx"

I am using the navigator function with the queryparams handler to preserve the query params. But when I get to the logincallback

export class LogincallbackPage implements OnInit {

  constructor(public router: Router, public authService: AuthService) {
    var urlParams = new URLSearchParams(window.location.search);

I have also tried with a more Angular approach:

(this.route is an ActivatedRoute) but nothing param is empty

    this.route.queryParams.forEach((param) => {
      console.log(param);
    });

It doesn’t have the query params. I also tried to fix queryParams with the {queryParams: {test: 1}} kind of approach, but it doesn’t work.

Thanks a lot

2

I am too facing issue of query params coming always empty object though in url i am passing id for detail view.

3

@gianarb how were you able to fix this issue ?