I am currently in the process of integrating an Angular 2 application with a Java Spring Boot backend. As of now, I have placed my Angular 2 files under src/main/resources/static
(which means that both the Angular and Spring apps are running within the same app on the same port).
My goal is to perform an HTTP GET request 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<Language[]> {
return this.http.get(this.langUrl)
.map((res:Response) => res.json())
}
}
In the code snippet above, error handling has been intentionally omitted from the GET method as it was causing misleading errors. The current error message being displayed 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 being handled by a Java Spring controller and functions correctly when using Postman or a web browser.
Based on my observations, it seems that the 404 Error is not originating from the server because:
- No activity related to the error is seen in the server logs.
- The same result is obtained regardless of whether the server-side is up or down.
My assumption is that there might be a misconfiguration in my Angular 2 setup, however, I have not found any relevant tips in the documentation.
I have experimented with different URLs such as
http://localhost:8080/api/languages
, /api/languages
, api/languages
, another/working/server/endpoint
- all resulting in the same error message.
I even attempted to utilize JSONP as outlined here, but encountered a separate issue where JSONP was not injected into the Language Service constructor (this specific problem may warrant a separate discussion).
A similar inquiry was discovered, yet remains unanswered thus far.
If anyone has suggestions on rectifying this issue or has faced a similar challenge before, any assistance or feedback would be greatly appreciated.
Thank you.