Eugene Shmorgun
Eugene Shmorgun

Reputation: 2075

What is correct approach to build REST angular application?

I have some java application. which provides json for REST-clients and use localhost:8080 to serve requests.

Also I have angular 2 application, which use localhost:3000 to work (I assumed that I can compile typescript files to js and use without lite-server, but not:

[email protected]?main=browser:269 Uncaught Error: More tasks executed then were scheduled.
index.html:20 Error: Error: XHR error loading file:///C:/dev/angular2app/app/main.js(…)

). My angular service is trying to get json form server from some url like this:

http://localhost:8080/api/test

Sure, I'm getting error about cross-domain request is prohibited. However, if I start angular app on the same port as java application, one of them will be having no place (port is busy and so on).

Pls, who can explain correct architectural approach to build such couple of application ?

Upvotes: 1

Views: 101

Answers (1)

Ironluca
Ironluca

Reputation: 3762

In your case, the AngularJS application, that is the JS, HTML files etc. needs to be packaged into a WAR file (I assume it is a WAR file since you are using Tomcat 8080) otherwise also the concept below would hold. Once you have the application deployed on the container (assuming the container is running on 8080), you would request the application with a probable URL http://IP:8080/appName/. In this case, there is no conflict of ports (actually conflict scenario does not apply). You have mentioned your angular works on port 3000, by which I assume you have hard coded the service URL as (probably) http://localhost:3000/. Now this would not work as the server is running on 8080. What you need to do is relativise the service invocation URLs in your application or hard code http://localhost:8080/ for your service URLs in Angular application. There is also another consideration, if you are using IP to access the application with browser and you are using hardcoded localhost in your service invocation URL, then the cross-domain problem would come. To avaid this use the URL as http://localhost:8080 ... to access the application from the browser. However, if you relativise the service invocation URLs in your Angular application, then you could use IP or localhost from your browser.

Upvotes: 2

Related Questions