1. 네비게이션 바 A. 로그인/회원가입 유저 플로우 개선 네비게이션 바에 공간이 부족한 것이 아님에도 로그인/회원가입의 기능을 모두 프로필 이미지에 감춰 놓아 사용성이 저하되고, 네비게이션 바의 역할을 제대로 하지 못하고 있음. 모든 사용자가 '프로필 이미지를 클릭했을 때, 로그인/회원가입을 할 수 있는 메뉴가 뜬다'는 인식을 하는 것은 아니므로 로그인 버튼을 직관적으로 바꾸는 것이 좋음. ① 로그인 상태가 아닐 때에는 로그인/회원가입 버튼을 네비게이션 바에 표시해 불필요한 클릭("프로필 사진 클릭 → 로그인/회원가입 클릭")을 줄여 유저 플로우를 개선. ② 로그인 상태일 때는 로그아웃, 마이페이지, 회원정보 수정 페이지를 프로필 이미지 옆의 햄버거 메뉴에 감춰두고, 햄버거 메뉴가 상호작용이 가능한 요..
1. AWS S3 이미지 네트워크 요청 AWS S3 이미지 링크를 의 src 속성에 직접 임베드하지 않고 Fetch API 요청으로 blob 객체를 받아올 때, CORS 오류가 발생함. S3 서버에 이미 CORS 설정이 되어있는데다가, 모든 이미지에서 CORS 오류가 발생하는 것은 아니었기 때문에 디버깅에 어려움이 있었음. 검색을 해보니 HTTP 캐시와 관련된 문제임을 확인할 수 있었고, 오류도 아래와 같은 상황에서 재현할 수 있었음. ① 웹페이지에 들어가고 나서 시간이 흐른 후 다시 들어갔을 때, CORS 오류가 발생함. ② 개발자 도구에서 '캐시 사용 중지' 기능을 활성화 했을 때 CORS 오류가 발생하지 않음. 두 가지 현상을 미뤄보아 캐시로 인한 문제임을 확신하게 됨. // 이미지 요청 로직 co..
문제해결 일지 2022. 11. 6. 21:07
1. 네비게이션 바 A. 로그인/회원가입 유저 플로우 개선 네비게이션 바에 공간이 부족한 것이 아님에도 로그인/회원가입의 기능을 모두 프로필 이미지에 감춰 놓아 사용성이 저하되고, 네비게이션 바의 역할을 제대로 하지 못하고 있음. 모든 사용자가 '프로필 이미지를 클릭했을 때, 로그인/회원가입을 할 수 있는 메뉴가 뜬다'는 인식을 하는 것은 아니므로 로그인 버튼을 직관적으로 바꾸는 것이 좋음. ① 로그인 상태가 아닐 때에는 로그인/회원가입 버튼을 네비게이션 바에 표시해 불필요한 클릭("프로필 사진 클릭 → 로그인/회원가입 클릭")을 줄여 유저 플로우를 개선. ② 로그인 상태일 때는 로그아웃, 마이페이지, 회원정보 수정 페이지를 프로필 이미지 옆의 햄버거 메뉴에 감춰두고, 햄버거 메뉴가 상호작용이 가능한 요..
문제해결 일지 2022. 10. 11. 22:06
1. AWS S3 이미지 네트워크 요청 AWS S3 이미지 링크를 의 src 속성에 직접 임베드하지 않고 Fetch API 요청으로 blob 객체를 받아올 때, CORS 오류가 발생함. S3 서버에 이미 CORS 설정이 되어있는데다가, 모든 이미지에서 CORS 오류가 발생하는 것은 아니었기 때문에 디버깅에 어려움이 있었음. 검색을 해보니 HTTP 캐시와 관련된 문제임을 확인할 수 있었고, 오류도 아래와 같은 상황에서 재현할 수 있었음. ① 웹페이지에 들어가고 나서 시간이 흐른 후 다시 들어갔을 때, CORS 오류가 발생함. ② 개발자 도구에서 '캐시 사용 중지' 기능을 활성화 했을 때 CORS 오류가 발생하지 않음. 두 가지 현상을 미뤄보아 캐시로 인한 문제임을 확신하게 됨. // 이미지 요청 로직 co..