After navigating to a different page within my project, an unexpected 404 error with the wrong URL appears in the console. Here's what it looks like:
However, it should actually look like this:
I have only targeted the example.com API in my project and nowhere have I specified to use the localhost:4220 API. This confusion is evident in my environment.ts file:
export const environment = {
production: false,
baseUrl: 'example.com/',
apiUrl: 'example.com/api/'
};
When utilizing the service within my component, here's how it is implemented:
export class CustomersComponent implements OnInit {
customers: any;
constructor(private http: HttpClient) { }
ngOnInit() {
const token = localStorage.getItem('jwt');
this.http.get(environment.apiUrl + 'customers', {
headers: new HttpHeaders({
'Authorization': 'Bearer ' + token,
'Content-Type': 'application/json'
})
}).subscribe(response => {
this.customers = response;
}, err => {
console.log(err);
});
}
}
Upon removing environment.apiUrl + from the code above, a different issue arises:
Request URL: http://localhost:4220/customers
This discrepancy raises the question of where the "localhost:4420/" portion is coming from and where it is being concatenated within the project.