공통 [REST API][실습] REST API 클라이언트 개발하기(REST Client 이용)

2017.05.23 15:17

험프리 조회 수:7102

이 글에서는 델파이를 이용해 REST API 서버와 연동하는 클라이언트 기술을 실습합니다.

REST 클라이언트 라이브러리 기반으로 실습합니다.

REST API 엔드포인트 연동

 

이 글에서는 REST API 서버의 REST API를 분석하고, 클라이언트에 표시 및 입력데이터를 서버에 저장하는 내용을 실습 위주로 진행합니다.

이 글에서는 데이터 처리하는 내용에 집중합니다. 이 글을 참고해 여러분이 만든 멋진 화면과 REST API를 연동하는 기술을 습득하시기 바랍니다.

 

이 글에 앞서 다음 내용의 이해가 필요합니다. 미리 선행 학습하시기 바랍니다.

 

이 글에서는 다음 내용을 다룹니다.

 

REST API 분석

이 글에서는 아래 링크에서 제작한 도서정보 REST API 서버를 대상으로 분석 및 연동합니다.

 

 

도서정보 REST API 서버에서 제공하는 엔드포인트는 아래와 같습니다. {item}에는 도서정보 아이디로 치환해야 합니다.

 엔드포인트

 역할

   데이터 포맷

 GET http://localhost:8080/books/

 도서정보 목록 조회

 응답: application/json

 GET http://localhost:8080/books/{item}/

 도서정보 상세 조회

 응답: application/json

 GET http://localhost:8080/books/{Item}/photo/

 도서정보 사진 조회

 응답: image/jpg

 POST http://localhost:8080/books/

 도서정보 생성

 요청 : application/json(Body)

 PUT http://localhost:8080/books/{item}/

 도서정보 수정

 요청 : application/json(Body)

 DELETE http://localhost:8080/books/{item}/

  도서정보 삭제  

 

REST API 분석은 REST Debugger(실행: Tools > REST Debugger 메뉴)를 이용합니다.

REST Debugger 상세정보 - http://docwiki.embarcadero.com/RADStudio/en/REST_Debugger_Tool (자동변역)

 

[실습] REST API 연동

실습에서는 도서대여 REST API 서버와 연동하는 클라이언트 프로그램을 제작합니다.

 

실습을 위해 도서대여 패키지를 포함한 EMS 서버를 실행합니다.

사전 준비사항

프로젝트 생성

클라이언트 프로그램은 델파이 멀티-디바이스 애플리케이션(Multi-Device Application)으로 진행합니다.

 

멀티-디바이스 애플리케이션 프로젝트를 생성(File > New > Multi-Device Application)합니다. 

프로젝트에 델파이 데이터 모듈을 추가(File > New > Other > Delphi Projects > Delphi Files > Data Module)합니다.

 

프로젝트를 저장합니다.(저는 아래와 같은 이름으로 저장했지만 다른 이름으로 저장해도 됩니다.)

 

데이터 모듈 이름을 "dmDataAccess"로 변경합니다. 폼 유닛(MobileForm)에서 데이터 모듈 유닛(DataAccessModule)을 사용할 수 있도록 uses 절에 추가합니다.

 

화면 구성(폼 디자인)

아래 그림을 참고해 화면을 구성합니다.

 

다음을 참고해 컴포넌트 이름을 지정합니다.

  • 버튼(TButton)
    • btnLoadData : 데이터 로드
    • btnNewData :  신규
    • btnDeleteData : 삭제
    • btnSaveData : 저장
  • 에디트(TEdit)
    • edtTtile : 제목
    • edtAuthor : 저자
    • edtISBN : ISBN
    • edtPrice : 가격
    • edtLink : 관련링크
  • 메모(TMemo)
    • mmoDescription : 설명

Get

Get 엔드포인트를 통해 도서정보 목록을 조회합니다.

REST API 분석

REST Debugger에서 아래와 같이 입력합니다.

  • Request 탭
    • Method : Get
    • URL : http://localhost:8080
    • Content-type : application/json
  • Parameters 탭
    • Resource : books

[Send Request] 버튼을 누릅니다.

 

위 이미지와 같이 200 : OK 메시지가 Response 영역에 표시되야 합니다.(200이 아닌 응답 상태 코드를 수신한 경우 EMS 서버 실행여부 또는 URL 등을 확인하시기 바랍니다.)

 

Response 영역의 Headers 탭과 Body탭을 통해 데이터 수신을 확인합니다.

JSON 데이터를 확인해, JSON 배열([])로 구성된 속성을 확인해 JSON Root Element에 입력 후 [Apply] 버튼을 클릭(또는 엔터)합니다.

 

Tabular Data 탭에 배열의 데이터가 테이블 형식으로 표시됩니다.

 

[Copy Components] 버튼을 눌러 분석한 데이터를 클립보드로 복사합니다.(이 컴포넌트는 개발에 직접 사용합니다.)

 

REST API 연동 구현

데이터 모듈에 붙여넣기(Ctrl + V) 후 아래 그림을 참고해 이름을 변경합니다.

 

각 컴포넌트의 역할과 주요 속성

  • TRESTClient - 서버 정보 설정
    • BaseURL : 서버 기본 URL
  • TRESTRequest - 요청할 정보 설정 및 요청 작업 수행
    • Client : TRESTClient 지정
    • Method : 요청 시 HTTP 메소드 종류
    • Resource : REST API 리소스 지정(URI에서 BaseURL 제외한 영역), 파라메터는 중괄호({})로 지정
    • Params : Resource에 포함된 파라메터 값 정
    • Response : 응답 객체(TRESTResponse) 지정
  • TRESTResponse - 요청의 응답 정보 보관
    • Content : 응답받은 데이터(string)
    • RootElement : 응답 데이터 중 필요한 항목 지정
  • TRESTResponseDataSetAdapter - 응답 데이터를 데이터셋으로 변환
    • Response : 변환 대상 응답데이터
    • Dataset : 변환한 데이터를 기록할 데이터 셋(TDataSet을 상속받은 메모리 테이블, TFDMemTable 또는 TClientDataSet 등)
    • RootElement : 응답 데이터 중 변환할 항목 지정
  • TFDMemTable - 메모리 테이블

reqList 컴포넌트 팝업메뉴에서 Execute 메뉴를 눌러 연결을 확인하고 데이터를 가져옵니다.

이 작업은 REST API 서버의 데이터를 받아 메모리테이블(TFDMemTable)에 데이터를 로드합니다. 이 데이터를 기반으로 메모리 테이블의 필드 정보를 표시하고, UI 컨트롤에 데이터를 표시합니다. 델파이에서 프로젝트를 새로 열었다면, 위 작업을 다시 시도해 데이터를 메모리 테이블에 로드해야 합니다.

 

폼의 [데이터 로드] 버튼 클릭 이벤트에 아래 코드를 구현합니다.

dmDataAccess.reqList.Execute;

 

도서목록 데이터를 그리드에 표시하기 위해 라이브 바인딩 디자이너 표시(View > Tool Windows > LiveBindings Designer) 후 아래 그림을 참고해 데이터와 UI컨트롤을 바인딩 합니다.

 

프로젝트를 실행하고, [데이터 로드] 버튼을 눌러 그리드에 정보가 표시되는 것을 확인합니다.

 

GetItem

GetItem 엔드포인트를 통해 도서정보 목록을 조회합니다.

REST API 분석

REST Debugger에서 아래와 같이 입력합니다.

  • Request 탭
    • Method : Get
    • URL : http://localhost:8080
    • Content-type : application/json
  • Parameters 탭
    • Resource : books/{item}/
    • Request parameters : item 항목에 도서정보 아이디 값 입력

[Send Request] 버튼을 누릅니다.

 

응답 데이터 확인 후 JSON Root Element에 "book" 입력 후 [Apply] 버튼을 누르고, Tabular Data 탭에서 데이터 표시를 확인합니다.

 

[Copy Components] 버튼을 누릅니다.

 

REST API 연동 구현

데이터 모듈에 붙여넣기 후 아래와 같이 이름을 변경합니다.

 

 TRESTClient는 재사용합니다. RESTClient2 컴포넌트를 제거합니다. reqDetail.Client 항목을 RESTClient1으로 지정합니다.

 

reqDetail 컴포넌트 팝업메뉴에서 Execute 메뉴를 눌러 데이터를 가져옵니다.

 

폼에서 라이브 바인딩 디자이너를 표시하고, 아래 그림을 참고해 바인딩합니다.

 

private 영역에 아래 변수와 메소드 추가 후 자동 완성(Shift + Ctrl + C)으로 구현부를 생성합니다.

private

  FSelectedSeq: Integer;

  procedure RequestDetail(ASeq: Integer);

  procedure LoadPhoto(ASeq: Integer);

  procedure ClearControls;

 

 

그리드의 OnSelChanged 이벤트(그리드 셀 변경)를 추가후 아래 코드를 구현합니다.

procedure TForm1.Grid1SelChanged(Sender: TObject);

var

  Seq: Integer;

begin

  if dmDataAccess.memBookList.RecordCount = 0 then

    Exit;

 

  Seq := dmDataAccess.memBookList.FieldByName('BOOK_SEQ').AsInteger;

  RequestDetail(Seq);

end;

 

procedure TForm1.ClearControls;

begin

  dmDataAccess.memBookDetail.EmptyDataSet;

  ImageControl1.Bitmap.Assign(nil);

end;

 

procedure TForm1.RequestDetail(ASeq: Integer);

begin

  FSelectedSeq := ASeq;

 

  ClearControls;

 

  dmDataAccess.reqDetail.Params.ParameterByName('item').Value := ASeq.ToString;

  BindSourceDB2.DataSource.Enabled := False;

  dmDataAccess.reqDetail.ExecuteAsync(procedure

  begin

    BindSourceDB2.DataSource.Enabled := True;

  end);

 

  LoadPhoto(ASeq);

end;

 

procedure TForm1.LoadPhoto(ASeq: Integer);

begin

end;

 

LoadPhoto 메소드는 아래에서 구현합니다.


GetItem - 이미지 수신

REST API 연동 구현

이미지 수신, 생성, 수정, 삭제에 공통으로 사용할 컴포넌트를 데이터 모듈에 추가합니다.

 

RESTRequest의 Client 항목을 RESTClient1으로 Reponse 항목을 RESTResponse로 지정합니다.

 

LoadPhoto 메소드에 아래와 같이 구현합니다.(TRESTRequestMethod는 REST.Types에 선언되어 있습니다. uses 절에 REST.Types를 추가하세요.)

procedure TForm1.LoadPhoto(ASeq: Integer);

var

  Stream: TMemoryStream;

begin

  dmDataAccess.RESTRequest.Method := TRESTRequestMethod.rmGET;

  dmDataAccess.RESTRequest.Resource := '/books/{item}/photo/';

  dmDataAccess.RESTRequest.Params.ParameterByName('item').Value := ASeq.ToString;

  dmDataAccess.RESTRequest.ExecuteAsync(procedure

    begin

      if dmDataAccess.RESTResponse.StatusCode = 404 then

        Exit;

      Stream := TMemoryStream.Create;

      try

        Stream.WriteData(dmDataAccess.RESTResponse.RawBytes, dmDataAccess.RESTResponse.ContentLength);

        ImageControl1.Bitmap.LoadFromStream(Stream);

      finally

        Stream.Free;

      end;

    end);

 

end;

프로젝트를 실행하고, 그리드를 변경해 상세 데이터 및 이미지 표현을 확인합니다.

Post / PutItem / DeleteItem

신규, 저장, 삭제 기능을 구현합니다.

REST API 연동 구현

데이터 모듈에서 데이터셋의 데이터를 JSON으로 반환하는 메소드를 작성합니다. 이 메소드는 Post, PutItem 엔드포인트 호출 시 사용합니다.

 

데이터 모듈의 uses 절에 "System.JSON, System.JSON.Writers"을 추가합니다.

 

아래 코드를 참고해, GetBookData 메소드를 정의하고, 구현합니다.

function TdmDataAccess.GetBookData: TJSONObject;

var

  Writer: TJsonObjectWriter;

begin

  Writer := TJsonObjectWriter.Create(False);

  try

    Writer.WriteStartObject;  // start resource

    Writer.WritePropertyName('book');

 

    Writer.WriteStartObject;  // start item

    Writer.WritePropertyName('BOOK_TITLE');

    Writer.WriteValue(memBookDetail.FieldByName('BOOK_TITLE').AsString);

 

    Writer.WritePropertyName('BOOK_ISBN');

    Writer.WriteValue(memBookDetail.FieldByName('BOOK_ISBN').AsString);

 

    Writer.WritePropertyName('BOOK_AUTHOR');

    Writer.WriteValue(memBookDetail.FieldByName('BOOK_AUTHOR').AsString);

 

    Writer.WritePropertyName('BOOK_PRICE');

    Writer.WriteValue(memBookDetail.FieldByName('BOOK_PRICE').AsString);

 

    Writer.WritePropertyName('BOOK_LINK');

    Writer.WriteValue(memBookDetail.FieldByName('BOOK_LINK').AsString);

 

    Writer.WritePropertyName('BOOK_DESCRIPTION');

    Writer.WriteValue(memBookDetail.FieldByName('BOOK_DESCRIPTION').AsString);

 

    Writer.WriteEndObject;  // end item

    Writer.WriteEndObject;  // end resource

 

    Result := Writer.JSON as TJSONObject;

  finally

    Writer.Free;

  end;

end;

 

[신규], [삭제], [저장] 버튼의 이벤트에 아래 코드를 작성합니다.

procedure TForm1.btnNewDataClick(Sender: TObject);

begin

  FSelectedSeq := -1;

  ClearControls;

end;

 

procedure TForm1.btnSaveDataClick(Sender: TObject);

var

  Data: TJSONObject;

begin

  if FSelectedSeq = -1 then

  begin

    dmDataAccess.RESTRequest.Method := TRESTRequestMethod.rmPOST;

    dmDataAccess.RESTRequest.Resource := '/books/';

  end

  else

  begin

    dmDataAccess.RESTRequest.Method := TRESTRequestMethod.rmPUT;

    dmDataAccess.RESTRequest.Resource := '/books/{item}/';

    dmDataAccess.RESTRequest.Params.ParameterByName('item').Value := FSelectedSeq.ToString;

  end;

  dmDataAccess.RESTRequest.ClearBody;

  Data := dmDataAccess.GetBookData;

  dmDataAccess.RESTRequest.Body.Add(Data);

  dmDataAccess.RESTRequest.Execute;

 

  ShowMessage('저장');

end;

 

procedure TForm1.btnDeleteDataClick(Sender: TObject);

begin

  dmDataAccess.RESTRequest.Method := TRESTRequestMethod.rmDELETE;

  dmDataAccess.RESTRequest.Resource := '/books/{item}/';

  dmDataAccess.RESTRequest.Params.ParameterByName('item').Value := FSelectedSeq.ToString;

  dmDataAccess.RESTRequest.Execute;

 

  ShowMessage('삭제');

end;

 

위 코드와 같이 단순한 요청, 응답의 경우 컴포넌트를 재사용 하는 것도 좋은 방법입니다.

 

완성된 프로젝트 파일

 RESTAPI_Client.zip


 

, 이 게시물을
Profile
목록
목록
번호 제목 글쓴이 날짜 조회 수
공지 [DelphiCon 요약] 코드사이트 로깅 실전 활용 기법 (Real-world CodeSite Logging Techniques) 관리자 2021.01.19 15465
공지 [UX Summit 요약] 오른쪽 클릭은 옳다 (Right Click is Right) 관리자 2020.11.16 13970
공지 [10.4 시드니] What's NEW! 신기능 자세히 보기 관리자 2020.05.27 16505
공지 RAD스튜디오(델파이,C++빌더) - 고객 사례 목록 관리자 2018.10.23 22061
공지 [데브기어 컨설팅] 모바일 앱 & 업그레이드 마이그레이션 [1] 관리자 2017.02.06 23270
공지 [전체 목록] 이 달의 기술자료 & 기술레터 관리자 2017.02.06 18932
공지 RAD스튜디오(델파이, C++빌더) - 시작하기 [1] 관리자 2015.06.30 39265
공지 RAD스튜디오(델파이,C++빌더) - 모바일 앱 개발 사례 (2020년 11월 업데이트 됨) 험프리 2014.01.16 174728
1223 [델파이 문법] 클래스와 객체 #16 file 관리자 2012.06.26 6339
1222 [동영상 강의] 델파이 기본 교육_20.스토어드 프로시저 관리자 2012.08.07 6328
1221 RAD Studio XE3와 SQLite 관리자 2012.10.09 6327
1220 인터베이스 (InterBase) 매뉴얼 및 튜토리얼 관리자 2012.06.15 6327
1219 [REST API] 다음 Kakao > 로컬 > 주소검색 연동하기 [2] 험프리 2017.09.18 6322
1218 [세미나자료] 인터베이스(InterBase) in Action, Live! file 관리자 2012.05.10 6261
1217 [C++빌더 XE3 비디오 31] dbExpress와 ClientDataSet을 사용해 SQL 데이터베이스 C++ 파이어몽키 앱 만들기 관리자 2013.01.09 6250
1216 안드로이드 API를 파이어몽키에서 사용하기(Toast 메세지 구현) file Humphery 2013.12.17 6222
1215 [환경설정] 아마존 EC2 이용해 윈도우 서버 환경 구축하기 [1] file 험프리 2017.04.13 6215
1214 [델파이 문법 시리즈] #7. 제네릭 - 클래스 변수, 표준함수 file 관리자 2012.04.02 6210
1213 파이어몽키 모바일에서 사용자 파일 배포 및 사용 file 험프리 2013.12.27 6202
1212 델파이 에서 안드로이드로 박병일 2012.01.06 6196
1211 [동영상강의] 델파이 기본 교육_11.메뉴 작성 컴포넌트 설명 관리자 2012.06.20 6182
1210 델파이에서 사용하는 각 Stream(스트림) 정리 김원경 2017.01.04 6165
1209 RAD스튜디오나 델파이만으로 (별도 맥 컴퓨터 없이) 아이폰 앱을 만들고 앱스토어에 올릴 수 있습니다. 관리자 2013.05.30 6160
1208 David I의 31 XE3 퀵 비디오 - 윈도우8 스타일 사용하기 관리자 2012.10.08 6159
1207 [동영상강의] 델파이 기본 교육_14.메모장 만들기3 (스프래쉬 화면과 리포지토리) 관리자 2012.07.06 6159
1206 PrintDialog 를 사용하지 않고 프린트 하기 박병일 2011.12.22 6157
1205 [델파이 문법] 프로시저와 함수 #7 file 관리자 2012.08.13 6136
1204 [10.2 도쿄] 델파이/C++빌더 리눅스 개발환경 설정하기 [1] file 험프리 2017.02.21 6128
쓰기
태그