My angular 4 frontend making http request to express backend and failing on 404

[LJ]

Hi 

I have angular front end with basic button click it triggers http get to express backend. I have router on the backend which takes the request and redirects to external server and gets back json data. 

Now my backend part was working fine until I added angular front end to it. 

Ex, 

backend router takes request from browser  for url "\getmejson"  then 

http:\\localhost:3000\getmejson -> calls external server configured in backend itself for credentials, login etc + authenication headers and gets json.

JSON fetched printed on console.

Now, I added front end code in angular 4 with service in TS, and other code etc. 

Button click calls basic 

http.get('sameURLhere') .subscribe(data=> {console.log(data)});

I know console.log will not work since it is async request and I see 404 returned. Browser trace is not very useful for newbie like me and I learnt for basic json fetching I do not need fancy and basic subscribe should work without implementing Observable. I want this request to be forwarded to backend router then to external server and data back to front end so I can render it.

Please suggest. I may not be able to give full codes but basic structure if needed.

[Lucas Lacroix]

URLs use forward-slash, "/", and not back-slash , "\".

So, using your example:

http.get('/getmejson')

    .subscribe((response) => {

        console.log(response);

    });

--
You received this message because you are subscribed to the Google Groups "Angular and AngularJS discussion" group.
To unsubscribe from this group and stop receiving emails from it, send an email to angular+u...@googlegroups.com.
To post to this group, send email to ang...@googlegroups.com.
Visit this group at https://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.

--

Lucas Lacroix

Computer Scientist

Advanced Technology Division, MEDITECH

781-774-2293

[LJ]

I had tried that.

I tried -http://localhot:3000/getmejson ( full url ) and just "/getmejson".  Feels to me I am missing something big in MEAN app. May be some concept to incorporate. My front end get request is not caught by my backend. Both are in same project with front end in "client" folder. I build client code and run the app on 3000. 

localhost: 3000 => takes to me front end served index html. Button clicks captured and http.get called. I use HTTPClientModule( angular 4) . From there, it should be express backend getting the get call and sending to router. 

Included routers, body parsers, static directory and headers info and router for that route "/getmejson"

Did I need to use any other modules at any end? I am still learning and do not know design and coding practices with MEAN framework.

[LJ]

Do I need to send parameters or headers ( json content type is default) from front end too? I set those in the backend side ( hard coded for now )and when user hits backend and router executes http get, those should be sent already and I should not worry but now since its not working, i am reconsidering.

My headers has login url etc info for external server so front end may not need to know that

[Lucas Lacroix]

It sounds like you are running two different services: one to host your app and one for your APIs. Is that correct?

[LJ]

Found and resolved the issue. Thanks