- This topic has 8개 답변, 5명 참여, and was last updated 4 years, 1 month 전에 by
.
-
글
-
-
비동기 처리 문제인데
우선 화면은 이런식으로 구성이 되어 있습니다. 조금 더 자세한 설명을 드리자면 각 텍스트 필드 아래에는 라벨이 숨겨져있어서 텍스트필드에 입력된 값에 따라 상태를 표시합니다. 예를 들자면 “ID가 중복됩니다” 를 표시하고 텍스트필드의 테두리를 빨간색으로 변경합니다.그런데 문제는 다음과 같습니다.
저는 우선 클라이언트에서 체크가 가능한 항목을 죄다 체크하고 서버에 아이디 중복 검사를 보냈어요
그러니까 영문 소문자, 숫자, 특수기호(_, -) 5 ~ 20자
이 경우를 체크하고 Mock 서버에 아이디를 보낸다고 가정합니다
그리고 Mock 서버는 항상 중복이라는 결과를 보낸다고 가정을 할게요
사용자가 아이디를 입력했고, 정규식을 통과해서 서버에 리퀘스트를 했습니다.
그런데 리스폰스가 오기 전에 사용자는 아이디를 지웠고
현재 텍스트필드의 테두리는 다시 회색이 되었고 아래 라벨은 아무 메세지를 표시하지 않습니다
여기까지는 의도했던 동작인데
아까 보냈던 리퀘스트의 리스폰스가 이 타이밍에 오면서
텍스트 필드의 테두리 색깔을 빨간색으로 바꾸고, 라벨의 값을 “ID가 중복됩니다” 라고 바꿨어요
그러니까 결과적으로 텍스트 필드는 비어있는데 ID가 중복인 경우가 된거죠.이 경우를 해결하기 위해 리스폰스가 오기 전까지 텍스트 필드의 값을 수정하지 못하도록 강제하는 것을 고려해봤으나, UX를 해칠까 생각되어 시도하지 않았습니다. 또 다른 해결 방법을 주먹구구식으로 해봤는데 결과적으로는 아랫돌 빼서 위에 올리는 격이 되더군요….
혹시 현재 상황을 해결하기 위한 키워드나 힌트를 부탁드려도 될까요?
-
아 그리고 야곰닷넷 UI 바꾼거 예쁘네요ㅎㅎ
-
단순히 생각해보면… 입력받았을 때의 문자열과, 서버로부터 응답을 받았을 때의 문자열이 다르면 처리해주지 않는 방법은 어떨까합니다.
즉, 클로저를 핸들러로 사용한다면 캡쳐된 값과, 현재 값을 비교해보면 어떨까 하는 생각이 들었어요. -
보통은 id중복 리퀘스트는 0.1초? 0.2~3초?처럼 오래걸리지 않기도한데, 만약에 시간이 좀 걸린다고하면 프로그레스바 돌려주시는 것은 방법은 기획의도와 다를까요 ?
그러면 눈에 보이는게 있으니 ux를 해치지 않기도 하구요. -
비동기로 결과가 서버로부터 돌아올 때 텍스트 필드를 다시 한번 확인하는 것은 어떨까요?
그래서 비어있다면 굳이 빨간 테두리로 바꾸지 않고요.
-
구현 방법이 좀 더 명확하면 좋을 것 같아요.
예를 들어 다음 버튼을 누를때 검사하는지, 아니면 텍스트필드에 값이 변경될 때마다 검사하는지에 따라 다를 것 같아요.
다음버튼을 눌러야 검사를 한다면 위에 모든 값이 입력된 상태에서 해야 할 것 같아, 위에 멍단비님이 말씀해 주신 인디케이터를 위에 표시하여 추가 입력수정을 막는 것이 좋을 듯합니다.
그게 아니라 텍스트필드에 값이 변경될 때마다 하는 경우, 저라면 dataTask를 가지고 있다가 새로운 요청이 들어올 경우 이전 작업을 취소시키고 새로 요청을 합니다. 그럼 이전 값이 유지될 경우 네트워킹을 통하여 현재 값에 대한 응답값을 받을 수 있고 그게 아니라 요청 중 사용자가 변경할 경우 이전 작업은 취소되고 새로운 텍스트 값을 기준으로 표시되므로 정보가 어긋나지 않을 겁니다.
-
다들 답변 감사드립니다!! 정말 많은 힌트들을 주셔서 이 난관을 잘 헤쳐나갈 수 있을거같아요!!
다시한번 감사드립니다-
어떻게 해결했는지도 다음 사람을 위해 남겨주면 더 좋을것 같아요!
-
-
- 답변은 로그인 후 가능합니다.
