Search code examples
angularangular2-routingangular-routingangular9

Angular routes not accessible through POSTMAN


I'm using angular 9 for a project which works fine in browser. I am trying to access a route through POSTMAN but I'm getting an error. How to make a route reachable through CLI?

Here are my routes

const routes: Routes = [
  {path:'', component: JoinClassComponent},
  {path:'home', component: HomeComponent},
  {path:'login', component: LoginComponent},
  {path:'class-ended', component: ClassEndedComponent},
  // otherwise redirect to home
  {path:'**', component: JoinClassComponent},
];

Here is the component

import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';

@Component({
  selector: 'app-class-ended',
  templateUrl: './class-ended.component.html',
  styleUrls: ['./class-ended.component.css']
})
export class ClassEndedComponent implements OnInit {

  constructor(private route: ActivatedRoute) { }

  ngOnInit(): void {
            const classID: string = this.route.snapshot.queryParamMap.get('meetingID');
           //rest of the logic
         }
}

URL Not working in POSTMAN

enter image description here

URL working in browser

URL working in browser

/ route working in POSTMAN

enter image description here


Solution

  • This cannot work, because Postman sends the URL localhost:4200/class-ended request to your server - and your server does not know anything about this URL.
    In comparison: when you enter the same URL in your browser, your angular application will handle the request.

    Angular builds Single-Page applications, so on your server, you will only have one index.html file in the root directory: i.e. when you visit localhost:4200, your web-server returns index.html to your browser (and this html file includes script tags to load your javascript source code).

    When you enter localhost:4200/class-ended in your browser, angular will be notified that the URL has changed and check the route configuration if the route /class-ended exists. If so, the angular-router will "navigate" to this route: i.e. it will display that component in the router-outlet.
    But this does not send any request to the server (and as mentioned above, this would not work, because class-ended does not exist on your server.