GET URL parameter in angular 4 / 5

693 views Asked by At

I'm trying to pass an URL using the GET method.

Actually a microcontroller is sending the GET sequence to a specific web page. On the Web site, I'm trying to get the parameters embedded in the GET sequence for further storage and processing. When I write directly the destination URL in chrome, it works with two methods :

    this.activatedRoute.queryParams.subscribe((params: Params) => {
    console.log(params);
    this.device_id = params.ID;
    this.Voltage = params.Voltage;
    console.log(this.device_id);
    console.log(this.Voltage);

    this.device_id = this.activatedRoute.snapshot.params['ID'];
    console.log(this.device_id);
    this.Voltage = this.activatedRoute.snapshot.params['Voltage'];
    console.log(this.Voltage);

    });

The first method with queryParams is when I send this URL : (http://www.quatuoradbd.com/Reception?ID=00-80-56-de-fr-00-d8-af&Voltage=2650)

the second method with snapshot is when I send this URL : (http://www.quatuoradbd.com/00-80-56-de-fr-00-d8-af/2650)

These two methods work when I pass the URL directly in the bar navigator.

But when those URL's are sent by a microcontroller, it doesn't work. I know that it should work because when my previous version of web site was written in PHP, everything was doing fine.

On the web server side, I receive parameters (by parameters I mean the resource address appended to the domain name) with :

    if(isset($_GET['Nbres']) OR isset($_GET['Local']))
    {
    $Nbres=$_GET['Nbres'];
    $Local=$_GET['Local'];
    }

But I don't understand why with Angular 4 (and 5) it doesn't work.

In Angular 4, is there a parameter that has to be modified? Or could this be coming from a specific router parameter that must be set? ... or a parameter on the server? If anyone as a hint, I would appreciate.

I join you my index.html, my app-routing.module.ts if it can help.

my index.html

    <!doctype html>
    <html lang="en">
    <head>
       <meta charset="utf-8">
       <title>Connectedfuture</title>
       <base href="/">

       <meta name="viewport" content="width=device-width, initial-scale=1">
       <link rel="icon" type="image/x-icon" href="favicon.ico">
       <script>document.write('<base href="' + document.location + '" />');
       </script>
    </head>
    <body>
      <app-root></app-root>
    </body>
    </html>

my app-routing.module.ts

    const routes: Routes = [
       { path: '', redirectTo: '/Accueil', pathMatch: 'full' },
       { path: 'ConfirmationCompte/:email', component: 
       ConfirmationCompteComponent },
       { path: 'Graphiques/:id', component: GraphiquesComponent },
       { path: 'Accueil', component: AccueilComponent },
       { path: 'Projets', component: ProjetsComponent },
       { path: 'Clients', component: ClientsComponent },
       { path: 'Histoire', component: HistoireComponent },
       { path: 'Inscription', component: InscriptionComponent },
       { path: 'Identification', component: IdentificationComponent },
       { path: 'Reception/:ID/:Voltage', component: ReceptionComponent },
       { path: 'Reception', component: ReceptionComponent },
       { path: 'Map', component: MapComponent },
       { path: 'App/:ID/:Voltage', component: AppComponent },
       { path: '**', component: InconnuComponent }
    ];
    @NgModule({
      imports: [RouterModule.forRoot(routes)],
      exports: [RouterModule]
    })
0

There are 0 answers