java & javascript에서 contextPath 구하기

root부터 모든 경로를 다 기입해야만 하는 [ 절대경로 ] 와는 달리,

내가 위치해있는 문서를 기준으로 페이지 url을 가져올 수 있는 [ 상대경로 ] 는

페이지 이동이 일어나는 코드를 작성할 때 요긴하게 사용된다.

(위치에따라 모든 url을 하나하나 바꿔줄 필요 없이 자동으로 바뀌니까)

 

java spring을 사용한다면, jsp파일에서

 

href="${pageContext.request.contextPath}/test.do"

 

위와 같이 url을 표기해준다.

 

 

그렇게 되면 웹에서는 자동으로 프로젝트의 contextPath를 가져오게 되는데,

아래 이미지를 보면, 나의 프로젝트는 appv2로 지정이 되어있다.

 

 

그런데, ${pageContext.request.contextPath} 을 사용하지 않고,

소스상에서 "http://localhost:8081/appv2/test.do" 와 같이 절대경로를 기입한 경우

프로젝트의 contextPath가 변경되는 상황이 올 때 하나하나 url을 바꿔주어야한다.

(유지보수 과정에서 프로젝트의 경로가 바뀌어야하거나,

혹은 이미 개발 완료 된 프로젝트를 복사하여 비슷한 다른 앱을 개발 & 배포해야 하는경우 등등..)

 

따라서 페이지 이동, 리소스 파일 불러올 때 등등 ${pageContext.request.contextPath} 는 유용하게 사용된다.

 

 

문법은 어렵지 않다. url에서 프로젝트 contextPath 부분만 바꿔주면 된다.

 

<img src="${pageContext.request.contextPath}/resources/main/images/close.png" alt="닫기">

 

 

**** 그런데 자바스크립트에서는 간혹 문자열로 처리가 되어 contextPath를 정상적으로 가져오지 못하는 경우가 있다.

그럴 땐 아래 방법을 사용해보자.

 

let hostIndex = location.href.indexOf( location.host ) + location.host.length;
let contextPath = location.href.substring( hostIndex, location.href.indexOf('/', hostIndex + 1) );
                
location.href = contextPath + "/test.do"

 

정상적으로 contextPath를 가져올 수 있다.

 

 

 

 

출처:

 

https://bongra.tistory.com/245

[JSP] ${pageContext.request.contextPath} 에 대한 정리 ( 그외 requestURL, scheme, serverName, serverPort, requestURI,servl

https://zzznara2.tistory.com/316

[자바스크립트] javascript로 contextPath 구하는 함수 만들어 사용하기