유저 이미지 출력 로직 개선

백엔드에 저장한 유저의 이미지를 프론트에서 출력하는데 문제가 발생했다. 이는 oauth2 로그인 유저, 일반 유저 구분하지 않고 서버에 저장된 유저의 이미지 경로를 래핑해서 반환해주기 때문이다. 일반 유저의 경우에는 이미지가 의도된대로 래핑되어 서버에서 반환 가능하다.

하지만 oauth2 유저의 경우 이미지를 구글에서 반환한다. https://**.com/** 이런 경로로 이미지 주소가 주어지게 된다. 이런 주소에서 이미지 처리 로직이 적용되면 imageAddressResolved/https://**.com/** 같은 경로가 만들어진다. 해당 주소는 서버에서 처리할 수 있는 주소가 아니기 때문에 사진이 있음에도 보여줄 수 없는 상황이 발생한다.

개선해보자.

1. 일반 유저라면 지금 로직 그대로 이미지 경로 반환하기
2. oauth2 유저라면 이미지 경로 처리 로직을 동작시키지 않기

변경 전

@Component  
public class FilePathUtil {  
  
    private final SaltUtil saltUtil;  
    private final String domain;  
    private final String uploadDir;  
  
    public FilePathUtil(SaltUtil saltUtil, @Value("${app.domain}") String domain, @Value("${app.upload-dir}") String uploadDir) {  
       this.saltUtil = saltUtil;  
       this.domain = domain;  
       this.uploadDir = uploadDir;  
    }  
  
    public String generateUserImageUploadPath(User user, String cleanedFileName, UserImageCategory userImageCategory) {  
       return uploadDir + "/" + user.getUsername() + "/photos/" + userImageCategory.getFileName() + saltUtil.salt() + "_" + cleanedFileName;  
    }  
  
    public String generateVideoUploadPath(String username, String cleanedFileName) {  
       return uploadDir + "/" + username + "/videos/" + saltUtil.salt() + "_" + cleanedFileName;  
    }
}

프론트에서 유저가 이미지를 요청할 때는 BASE_URL + user_image_location 의 url에 접근하였다.

변경 후

@Component  
public class FilePathUtil {  
  
    private final SaltUtil saltUtil;  
    private final String domain;  
    private final String uploadDir;  
  
    public FilePathUtil(SaltUtil saltUtil, @Value("${app.domain}") String domain, @Value("${app.upload-dir}") String uploadDir) {  
       this.saltUtil = saltUtil;  
       this.domain = domain;  
       this.uploadDir = uploadDir;  
    }  
  
    public String generateUserImageUploadPath(User user, String cleanedFileName, UserImageCategory userImageCategory) {  
       return uploadDir + "/" + user.getUsername() + "/photos/" + userImageCategory.getFileName() + saltUtil.salt() + "_" + cleanedFileName;  
    }  
  
    public String generateVideoUploadPath(String username, String cleanedFileName) {  
       return uploadDir + "/" + username + "/videos/" + saltUtil.salt() + "_" + cleanedFileName;  
    }  
  
    public String generateUserImageDownloadPath(String userImagePath) {  
       if(userImagePath == null) return null;  
       return userImagePath.startsWith("http") ? userImagePath : domain + "/" + userImagePath;  
    }  
}

generateUserImageDownloadPath() 메서드를 추가했다. 유저가 지정한 이미지가 없다면 null을 반환해서 기본 사진을 보여주게 설정했다. 만약 유저가 지정한 이미지가 http로 시작한다면 oauth2로 입력받은 이미지라는 뜻이다. 따라서 이미지 경로를 그대로 반환한다. 마지막으로 유저가 자신의 사진을 직접 지정해뒀다면 값을 그대로 반환해준다.