[FE] 회원가입, 회원정보 수정 시점에서 human parsing request 보내기

[wynter122]

현재까지는 프론트에서 s3에 이미지 저장 -> 저장한 url 을 백에 전송

하는 부분까지 진행되었는데, 이미지를 저장한 이후에 한번 더 request 를 보내서 human parsing 을 처리해야합니다.

프론트 두분 중 한분과 @dh5473 님이 진행해주세요

[dh5473]

이슈를 늦게 봤네요.. 저장한 url 백에서 받는 순간 human_parsing도 진행해서 ec2 서버에도 uid 별로 저장해둡니다. request는 s3이미지 경로 한 번만 보내도 돼요.

[wynter122]

해당부분이 혹시 #102 PR에 포함된건가요?

[dh5473]

네네 포함되어있습니다

[wynter122]

혹시 트리거가 어떻게 구성되어있는지 알려주실 수 있나요? 프론트에서는 지금 sign-up api에 한번 request 를 보내고 있는걸로 알고있는데, 백의 sign up view 에서 human parsing 트리거가 어떻게 되는지 파악이 어려워서요

[dh5473]

sign-up url로 post request 보낸다는 말씀 아닌가요? 똑같이 다시 보내면 되는데 어떤 트리거를 말씀하시는 건지??

[wynter122]

맞아요 현재 프론트가 sign up view 에만 request 를 보내고있고, human parsing view 에는 request 를 보내고 있지 않아서 프론트단에서 그 부분을 진행하는 이슈로 만든거였어요.

저장한 url 백에서 받는 순간 human_parsing도 진행해서 ec2 서버에도 uid 별로 저장해둡니다. request는 s3이미지 경로 한 번만 보내도 돼요.

라고 하셔서 "sign up view 에 한번만 보내면 백에서 알아서 처리한다" 라고 이해해서 다시 여쭤본거에요 😄

그럼 백단에서는 해당부분 작업이 끝난거고 api에 프론트가 request 를 보내기만 하면 되는거... 맞죠??

[dh5473]

엥 아 죄송해요 당연히 따로 보낸다고 생각하고 있었어요.. 네네 제 모델 쪽 api에 s3경로 담아서 request 보내기만 하면 됩니당

[dh5473]

제 api에 두 번 보내야된다는 걸로 잘못 이해했네요

[wynter122]

ㅎ 저도 저번에 돈혁님이랑 이걸로 얘기 나눌때 당연히 따로 한번씩 보내는걸로 이해했는데 혹시나해서 확인차 이슈 만든거라...! 너무신경쓰지 않으셔도 됩니당

@lucyya99 @grapefruit224 두분께서는 참고하셔서 api 날리는 코드 만들어주세요!

[lucyya99]

알바하면서 남기다가 지워졌네요 😥

문제가 될 만한 상황은 회원가입 후 바로 로그인 버튼 -> 피팅하기 바로 눌러서 결과이미지 띄워주는 상황인 것 같아요 (human parsing data가 생성되기 이전)

api에 요청보냈을 때 human parsing data가 없는 경우, 프론트에서는 결과이미지랑 똑같이 생성중이라는 로딩화면 띄워주면 해결이 됩니다. 결과 이미지 요청 api를 보낸 후 백에서 이와 관련된 처리가 있나요?

저는 서버에 결과 이미지 요청을 보내면, dev 서버에서 DB에 저장되어있던 human parsing data를 가져와서 결과 이미지 전송 api에 보내주는 걸로 알고 있는데, 이와 관련해서 프론트에서는 dev 서버에 결과 이미지 api로만 요청 보내면 되는게 맞는거죠...?

저런 상황이 많지는 않겠지만 시연할 때 발생할 수도 있을 것 같아서 질문드립니다..!

[wynter122]

저는 서버에 결과 이미지 요청을 보내면, dev 서버에서 DB에 저장되어있던 human parsing data를 가져와서 결과 이미지 전송 api에 보내주는 걸로 알고 있는데, 이와 관련해서 프론트에서는 dev 서버에 결과 이미지 api로만 요청 보내면 되는게 맞는거죠...?

그 부분은 결과이미지 api 이슈에서 다루면 될것같습니다.

본 이슈에서는 회원가입과 회원정보 수정시에 human parsing api 를 보내는 부분만 다루면 될 것 같아요.

그 외에 문제가 될 상황이라고 생각하시는 부분 "회원가입 후 바로 로그인 -> 피팅하기" 를 하는 경우는 human parsing 이 되는 시간이 얼마나 걸리냐에 따라 다를 것 같아요. 실제 서비스를 한다면 문제가 될 수도 있을 것 같은데, 시연 단계에서는 그렇게 문제가 될 것 같지는 않는 것 같습니다.

[lucyya99]

@dh5473 #104 에서 수정하였는데 확인과 테스트 부탁드립니다! #104 에 자세히 적어두었어요

[lucyya99]

input : header - token / body - human_img_path , user_id 으로 진행하였고, 성공했습니다!

Future<bool> requestHumanParsingData(String id) async {
      try {
        final storage = ref.read(secureStorageProvider);
        dio.options.headers = {'accessToken': 'true'};
        dio.interceptors.add(
          CustomInterceptor(storage: storage),
        );
        await dio.post(
          HUMAN_INFER_URL,
          data: json.encode({
            'human_img_path': '${id}_human.png',
            'user_id': id,
          }),
        );
      } on DioError catch (e) {
        print(e.response);
        return false;
      }
      return true;
    }

[wynter122]

이부분에서 토큰 사용하는데 굳이 uid 포함하는 이유가 있나요?

[dh5473]

저는 로그인을 처음 할 때 사용자 사진을 보내는 걸로 이해했는데, 회원가입과 동시에 진행된다고 해서 포함했습니다. 회원가입 때는 토큰 발행 안하고 로그인할 때 토큰 발행하니까요,,

[wynter122]

아 그러네요. 그럼 토큰은 없어야하는게 맞는거죠? +그리고 api도 allowany로 권한 제어를 해둬야 하는거겠죠?

[dh5473]

안그래도 dl api는 오류 생겨서 allowany로 바꿨는데, signup은 되어 있던데요? signin은 토큰 발급 받으니까 그대로 해도 될 거 같은데, 안되면 allowany로 바꿔야할 거 같아요

[wynter122]

네 제가 만든 api중 sign up이랑 get presigned url은 allowany로 지정해두었습니다! 회원가입시점에서 사용해서요

[lucyya99]

이 부분 일단 회의에서 상의하는게 좋을 것 같아요..!!

[wynter122]

그러면, 이 부분 관련해서는 수정사항 및 로직이 이렇게 파악되는데 이상이 없는지 확인 부탁드립니다. @lucyya99 @dh5473 @grapefruit224

프론트

• 회원가입시 사진 찍지 않음. (uid, pw, nickname 만 back 으로 전달).
• 회원가입 성공시 바로 동일 uid 및 password 로 로그인 api 요청.
• 로그인 api 의 response 에서 회원 사진 정보가 없다는 정보를 반환받으면 -> 온보딩페이지 ㄱㄱ -> 사진 찍어서 s3 저장 -> s3_url 백에 저장 요청 -> s3_url 로 human_parsing 요청
• 로그인 api 의 response 에서 회원 사진 정보가 있으면 -> 메인페이지 ㄱ ㄱ

백

• user model 의 회원사진_url 필드를 nullable 로 변경
• 로그인 api 에서 회원의 s3_img_url 필드가 null 인지 아닌지 판단하여 response 에 포함
• DB 에 s3_img_url 저장 하는 api 추가
• presinged_url 을 토큰 식별 및 IsAuthenticated 로 권한 제어

이상없으면 저는 바로 백단 수정 할게요

[lucyya99]

넵 이상 없습니다!

프론트

위에 적은 것에서 추가적으로

• [x] secureStorage에도 첫 로그인 여부 저장 - splash screen에서 사용하기 위함 (현재 refreshToken 검증 -> 유효하면 홈화면, 유효하지않으면 로그인화면 => 이렇게 안하면 만약 온보딩으로 넘어갔다가 앱 재실행한 경우 홈화면으로 넘어감)
• [x] [회원가입 - 회원가입/로그인 api 전송] -> 온보딩(처음 로그인 유무 확인x) -> ... : splash screen에서 토큰/첫로그인 여부 확인
• [x] presigned url 요청하는 코드에 전부 토큰 추가 -> 카메라 결과, 갤러리 이미지 선택 화면
• [x] 온보딩 -> 카메라 -> 저장(+처음 로그인 여부 = false) -> splash screen (혹시 access토큰이 만료되었을 경우 refreshToken으로 accessToken 재발행, refreshToken도 만료되면 재로그인하도록 만들기 위해)

저도 여기에 작성해두고 빼먹은거 없나 확인해볼게요 완전 깔끔하게 잘 정리하신 것 같아요 이거 바탕으로 수정하겠습니다

[230516] api 수정사항에 따라 변경될 것들만 todo로 표시해서 반영했습니다