AngularJS와 NodeJS간 HTTP 통신 예제(GET/POST 방식)

HTTP

얼마 전에 AngularJS와 NodeJS 간 통신하는

예제에 관한 포스팅을 했었습니다. 단순히

AngularJS 기반으로 개발된 HTML 페이지

에서 NodeJS를 호출하는 예제였는데

앵귤러JS의 $http를 이용한 HTTP 통신

예제였습니다. 단순히 호출만 하는 예제였지요

>AngularJS와 Node 간 통신<

오늘도 이 작업을 계속 했는데

작업을 하다 보니 HTML 페이지에서

NodeJS로 단순히 호출하는 것에서

끝나지 않고 파라미터를 보내야 되는

상황이 생겨서 또 이 거에 대해 오늘

하루종일 삽질 했습니다.

웹 페이지에서 노드JS로 호출할 때

파라미터를 줄 수 있을 거라 생각하고

찾아 봤지만 생각처럼 쉽게 방법을

찾지는 못했지만 결국은 찾았습니다.

HTML

화면 소스입니다.

CreateTopic 버튼을 누르면

createTopic() 함수가 호출되는 부분이

제가 작업한 부분에 해당합니다.

Controller

그럼 해당 페이지의 controller에 선언된

createTopic 함수가 호출됩니다.

위에 캡처 화면을 보시면 제일 마지막 라인에

$http.get('create', {params: parameters});

이 부분이 있는데 이 라인에서 NodeJS의

함수를 create라는 값을 key로 호출하게

됩니다. 그리고 그 뒤에 있는

{params: parameters} 가 NodeJS로

보내려는 파라미터에 해당합니다.

params라는 키고 parameters 라는

변수가 값으로 Json 형태로 노드JS로

파라미터를 보내주고 있습니다.

이 때 Parameters 라는 변수의 값은

그 위에 선언된 것처럼 amount와

description 이라는 키 값으로 각각

123,l 'test' 값이 json 형태로 선언

되어 있습니다. AngularJS나 json

형태에 익숙하지 않으신 분들은

이해 하기가 좀 난해할 거란 생각이 드네요

NodeJS

그리고 최종적으로 호출을 받는

노드JS 소스입니다.

위에 controller에서 create 라는 키로

요청을 보냈고, 위에 보시는 것처럼

NodeJS에 create라는 값을 받아

화면의 요청을 받게 됩니다.

그리고 안에 내용은 화면으로부터

받은 parameter의 값을 빼오는 부분입니다.

req 변수에 요청에 대한 정보가 담겨있고,

당연히 그 안에 파라미터도 담겨 있는데

가지고 올 때 req.query 를 통해 파라미터

전체를 받아온 후 화면에서 설정해준

키 값으로 amount와 descript 값을

읽어 왔습니다. 그 후 확인을 위해

console로 찍은 거구요~

이렇게 화면 화면에서 보내준 값을

받아왔구요 res.send 함수를 통해

화면에 응답을 보내주고 있습니다.

아직도 할 게 많지만 일단 또 어렵게

어렵게 한 고비를 넘었습니다. 물론

아직 남은 고비가 훨씬 많습니다 ㅋ