Team-Safezone / Safezone-iOS

팀 Safezone의 iOS 작업 공간
0 stars 0 forks source link

♻️ [REFACTOR] 네트워크 통신 구조 리펙토링 및 한달경기 조회, 하루경기 조회, 심박수 통계 조회 로직 변경 #38

Closed yooonji08 closed 1 month ago

yooonji08 commented 1 month ago

🎟️ 관련 이슈 번호, Jira 번호

closed issue #36 closed jira #SF-79

✨ 변경 사항 및 이유

  1. BASE_URL 저장 방법 변경

    xcconfig 파일 사용

  2. KeyChain에 access token을 저장하는 로직 추가
  3. 네트워크 구조 및 API 통신 구조 리펙토링

    Network > Models > Request 폴더 생성 NetworkConstants.swift 파일 변경 및 MyRequestInterceptor.swift 추가

  4. 한달 경기 조회, 하루 경기 조회 API 로직 변경
  5. 심박수 통계 API 명세서 새롭게 작성

    기존: 하나의 화면에서 필요한 데이터를 여러 개의 api를 통해서 값을 받아오고 있었음 변경: 하나의 api를 통해서 필요한 값을 받아오도록 변경

  6. 심박수 통계 조회 API 로직 추가

💡 MVVM 구조에서의 API 통신 로직 사용법

  1. API 명세서를 작성한다.

    API 명세서를 작성할 때, 주로 하나의 화면에서 필요한 데이터는 GET 메소드를 사용하여 하나의 API를 통해서 받아옵니다. 그러나, 특수한 경우 하나의 화면에서 두가지의 API를 사용하기도 합니다. 예를 들어, 경기 캘린더의 경우, 한달 경기 일정을 조회한 후, 사용자가 클릭한 날짜에 맞게 하루 경기 일정을 조회하는 api를 쏴줍니다. 이렇듯, 사용자의 이벤트 클릭에 따른 변화를 제외하고는, 주로 하나의 화면에서는 하나의 api를 통해서 데이터를 받아옵니다.

  2. API 명세서에서 Request부분과 Response 부분을 참고하여, Request, Response 모델을 작성한다.

    Network -> Models -> Request, Network -> Models -> Response 폴더에 api 요청, 응답 모델을 작성합니다. 이때, Request부분의 경우, Query Parameter에 들어갈 데이터와 Request Body에 들어갈 데이터를 같이 작성합니다.

  3. API에 대한 Service 파일을 생성한 후, api 통신을 하기 위한 기본 구조를 작성합니다.

    3.1 Network -> APIManagers -> Services 폴더에 화면명+Service 조합으로 파일을 생성합니다. 3.2 TargetType을 상속받아, extension 코드를 작성합니다. Service에서는 method, endpoint, header, parameter를 설정합니다. 3.2.1 method는 get, post, patch, delete를 설정합니다. 3.2.2 endpoint는 APIConstants.swift 파일에 상수로 지정하여 관리합니다. url을 한눈에 파악할 수 있기 때문입니다. 3.2.3 header는 basic 또는 multipart 중 선택합니다. 사진, 동영상을 업로드하는 api는 multipart를 사용하고, 그 외에는 basic을 사용합니다. 3.2.4 paramteter는 RequestParams에 있는 값 중 하나를 선택합니다.

    query는 api 요청 시, Query Parameter에 값이 있을 경우 사용합니다. queryBody는 api 요청 시, Query Parameter와 request body에 값이 있을 경우 사용합니다. requestBody는 api 요청 시, request body에 값이 있을 경우 사용합니다. requestPlain는 api 요청 시, Query Parameter와 body에 추가 값이 없을 경우 사용합니다.

  4. Network -> APIManagers 폴더에 API 통신을 하기 위해서 API 파일을 생성합니다.

    4.1 파일명은 화면명+API 조합을 사용합니다. 4.2 BaseAPI를 상속받아, class 코드를 작성합니다. Combine을 사용하여 비동기 호출을 위한 코드를 작성합니다. 4.3 서버에서 보내주는 status code에 맞게 success, failure 처리를 합니다.

  5. Screen -> ViewModels 폴더에 프로토콜 파일과 뷰모델 파일을 생성합니다.

    5.1 프로토콜 파일은 뷰모델에서 사용되는 함수와 변수를 한눈에 볼 수 있도록 만들기 위해서 사용합니다. 5.2 ViewModel 파일은 프로토콜 파일을 상속 받아서 사용합니다. 5.3 ViewModel 파일에 있는 변수는 뷰에서 사용됩니다. 5.4 ViewModel 파일에 있는 함수는 API파일에서 success, failure 처리한 결과를 가져옵니다.

    5.4.1 만약, 서버에서 response body에 값을 보내주는 것이 있다면, map 부분에서 DTO 타입을 Entity 타입으로 변환하는 작업을 합니다. >> 5.4.2 receiveValue에서는 뷰에서 사용될 변수에 dto->entity로 변환된 값(map 부분에서 변환한 값)을 주입하는 코드를 작성합니다. MatchEventViewModel과 HeartRateViewModel을 참고하시면 이해가 되시리라 생각됩니다!

  6. View에서 ViewModel 변수를 @ObservedObject 타입으로 선언합니다. 이후, 뷰모델에 있는 함수를 사용하여 api 통신 요청이 필요한 곳에 코드를 작성합니다. api 통신 응답 결과는 뷰모델에 있는 변수를 불러와서 뷰에 적용합니다.

추신) 코드 작성하실 때, 주석 많이 작성해주시면 좋을 것 같아요..! 심박수 통계 조회 로직 수정하면서 헷갈렸어요😅😅