배경
어드민 퀴즈셋 참여 현황(#256)은 캐리커쳐를 파일 이름(m3) 글자로만 보여 준다. 캐리커쳐 값은 FE 경로(/onboarding/profileimg/avatar/m3.svg)라, 백엔드가 그리는 어드민 화면에서 그대로 <img>에 넣으면 백엔드 서버에서 파일을 찾아 깨진다.
변경
FE 주소를 설정으로 받아 어드민에서 FE 서버의 그림을 불러온다.
application.yml: app.front.base-url: ${FRONT_BASE_URL:http://localhost:3000}.aws/task-definition.json: FRONT_BASE_URL=https://ditto.pics (기존 FRONT_OAUTH_CALLBACK_URL과 같은 일반 환경 변수)- 템플릿:
/로 시작하는 값에만 FE 주소를 붙여 <img>로 보여 주고, 형식이 다른 값은 글자 그대로 둔다
확인한 것: 어드민 페이지에 CSP가 없고, 다른 도메인 <img>는 CORS 제약을 받지 않는다.
검토한 대안
아바타 16개를 서버 static/admin/avatar/로 복사하는 방법. 설정이 필요 없지만 16개 합계 4.6MB로 jar가 커지고, FE가 그림을 바꾸면 어드민만 예전 그림이 남는다.
선행
#256 머지 후.
배경
어드민 퀴즈셋 참여 현황(#256)은 캐리커쳐를 파일 이름(
m3) 글자로만 보여 준다. 캐리커쳐 값은 FE 경로(/onboarding/profileimg/avatar/m3.svg)라, 백엔드가 그리는 어드민 화면에서 그대로<img>에 넣으면 백엔드 서버에서 파일을 찾아 깨진다.변경
FE 주소를 설정으로 받아 어드민에서 FE 서버의 그림을 불러온다.
application.yml:app.front.base-url: ${FRONT_BASE_URL:http://localhost:3000}.aws/task-definition.json:FRONT_BASE_URL=https://ditto.pics(기존FRONT_OAUTH_CALLBACK_URL과 같은 일반 환경 변수)/로 시작하는 값에만 FE 주소를 붙여<img>로 보여 주고, 형식이 다른 값은 글자 그대로 둔다확인한 것: 어드민 페이지에 CSP가 없고, 다른 도메인
<img>는 CORS 제약을 받지 않는다.검토한 대안
아바타 16개를 서버
static/admin/avatar/로 복사하는 방법. 설정이 필요 없지만 16개 합계 4.6MB로 jar가 커지고, FE가 그림을 바꾸면 어드민만 예전 그림이 남는다.선행
#256 머지 후.