서버 프로젝트 외부 경로 접근 (이미지 미리보기)

 

서버 로컬에 있는 이미지파일에 접근해야해서

아래와 같이 설정함

 

@Configuration
public class WebConfig implements WebMvcConfigurer {

    @Override
    public void addResourceHandlers(ResourceHandlerRegistry registry) {
        registry.addResourceHandler("/imageView/my/**")
                .addResourceLocations("file:///c:/images/my_images/");
                
        registry.addResourceHandler("/imageView/hell/**")
      	        .addResourceLocations("file:///c:/images/hell_images/");
    }

}

addResourceHandler 는 클라이언트가 요청하는 주소

addResourceLocations 는 요청 주소에 매칭되는 로컬 경로이다.

 

xxx.xxx.xxx:xxxx/imageView/hello.jpg 로 접근한다면 

해당 서버의 c:드라이브 > images폴더 > my_images 경로에 붙어서 hello.jpg 파일을 찾는다

 

<img src="http://localhost:8018/server/imageView/proof_01.jpg" alt="이미지" width="300"
                   className={'clickable'} onClick={(e) => { window.open(e.target.src) }} />

위와 같이 사용함.

 

 

 

imageView ~ 로 들어오는 요청은

서버 로컬 경로에서 파일을 찾아 보여준다