Angular 2 HTTP GET 404 Not Found for URL

问题:

I am trying to integrate Angular 2 application with Java Spring Boot backend. For the moment, I place my Angular 2 files under src/main/resources/static (meaning both Angular and Spring apps run witin the same app on the same port).

I am trying to do HTTP GET like this:

import { Injectable } from '@angular/core'; import { Http } from '@angular/http'; import { Language } from '../model/language'; import { Observable } from 'rxjs/Rx'; import 'rxjs/add/operator/catch'; import 'rxjs/add/operator/map';  @Injectable() export class LanguageService {      constructor(private http: Http) { }      private langUrl = 'api/languages';       getLanguages() : Observable {          return this.http.get(this.langUrl)                          .map((res:Response) => res.json())      } } 

I have intentionally removed error handling code from get, because it leads to misleading error. What I get is:

Error: Uncaught (in promise): Error: Error in :0:0 caused by: Response with status: 404 Not Found for URL: api/languages Error: Error in :0:0 caused by: Response with status: 404 Not Found for URL: api/languages     at ViewWrappedError.BaseError [as constructor] (http://localhost:8000/node_modules/@angular/core/bundles/core.umd.js:1179:31) [angular]     at ViewWrappedError.WrappedError [as constructor] (http://localhost:8000/node_modules/@angular/core/bundles/core.umd.js:1232:20) [angular]     at new ViewWrappedError (http://localhost:8000/node_modules/@angular/core/bundles/core.umd.js:6552:20) [angular] //more output here - will provide full stack trace if needed 

The URL http://localhost:8080/api/languages is handled by Java Spring controller and it works if I do GET via Postman or Web Browser.

My impression is that 404 Error did not come from server, because:

• I don't see any activity in the server logs
• I get the same result regardless if server side is up or down.

I think there is something wrong with my Angular 2 configuration, but I don't find any tips in documentation.

I tried different urls, like http://localhost:8080/api/languages, /api/languages, api/languages, another/working/server/endpoint - all lead to the same error.

I have even tried to use JSONP as described here, but I got a different issue that JSONP was not injected to the Language Service constructor (that issue is a different topic, I guess).

I have found a similar question, but it was never answered so far.

If you have any ideas how to fix this issue or experienced the similar problem - any help or comment will be highly appreciated.

Thank you

回答1:

The reason of this error was that I used Angular Tour of Heroes applcation as a basis for mine, and I did not remove the dependency

 "angular-in-memory-web-api": "~0.2.4", 

and InMemoryWebApiModule from app.module.ts. Because of this all requests were intercepted by InMemoryWebApiModule (despite I did not call it directly as described in Tour of Heroes Tutorial), that's why I did not see any XMLHttpRequests in 'Network' tab of the browser debugger.

After I have removed the dependency from package.json and node_modules directory, it started working normally, however, I had to change the service code to parse Json directly to TypeScript objects like this:

getLanguages(): Promise {     return this.http.get(this.langUrl)         .toPromise()         .then(response => response.json() as Language[])         .catch(this.handleError); } 

This is a newbie mistake, but I hope this post will save a couple of hours of research to someone.

回答2:

I had a similar issue, after some frustrating researches I solved the 404 error thanks to this. The order of imports matters.
Hope it helps someone.

回答3:

In Chrome or Firefox you can see the HTTP requests and responses your application executes (just hit F12 and select the Network tab). Since you are saying it is working with your browser or Postman, you can compare both requests and should quickly find the difference.

文章来源: Angular 2 HTTP GET 404 Not Found for URL