JSP 파일에 의해 생성 된 HTML 페이지의 모든 상대 URL은 예상대로 서버 측의 JSP 파일 위치가 아니라 현재 요청 URL (브라우저 주소 표시 줄에 표시되는 URL)에 상대적 입니다. 즉, 디스크에서 리소스를 포함해야하는 웹 서버가 아니라 URL별로 리소스를 개별적으로 다운로드해야하는 웹 브라우저입니다.
JSP 파일의 위치 대신 서블릿의 URL을 기준으로 상대 URL을 변경하는 것 외에도이 문제를 해결하는 또 다른 방법은 도메인 루트에 대해 상대 URL을 만드는 것입니다 (예 :로 시작 /
). 이렇게하면 서블릿의 URL을 변경할 때 상대 경로를 다시 변경하는 것에 대해 걱정할 필요가 없습니다.
<head>
<link rel="stylesheet" href="/context/css/default.css" />
<script src="/context/js/default.js"></script>
</head>
<body>
<img src="/context/img/logo.png" />
<a href="/context/page.jsp">link</a>
<form action="/context/servlet"><input type="submit" /></form>
</body>
그러나 컨텍스트 경로를 하드 코딩하지 않는 것이 좋습니다. 매우 합리적입니다. 를 사용하여 EL에서 컨텍스트 경로를 얻을 수 있습니다 ${pageContext.request.contextPath}
.
<head>
<link rel="stylesheet" href="${pageContext.request.contextPath}/css/default.css" />
<script src="${pageContext.request.contextPath}/js/default.js"></script>
</head>
<body>
<img src="${pageContext.request.contextPath}/img/logo.png" />
<a href="${pageContext.request.contextPath}/page.jsp">link</a>
<form action="${pageContext.request.contextPath}/servlet"><input type="submit" /></form>
</body>
(쉽게 단축하여 다른 곳 <c:set var="root" value="${pageContext.request.contextPath}" />
에서처럼 사용할 수 있음 ${root}
)
또는 읽을 수없는 XML과 깨진 XML 구문 강조 표시를 두려워하지 않는다면 JSTL을 사용하십시오 <c:url>
.
<head>
<link rel="stylesheet" href="<c:url value="/css/default.css" />" />
<script src="<c:url value="/js/default.js" />"></script>
</head>
<body>
<img src="<c:url value="/img/logo.png" />" />
<a href="<c:url value="/page.jsp" />">link</a>
<form action="<c:url value="/servlet" />"><input type="submit" /></form>
</body>
어느 쪽이든, 상대 URL이 많은 경우 이는 차례로 매우 번거 롭습니다. 이를 위해 <base>
태그를 사용할 수 있습니다 . 모든 상대 URL은 즉시 상대 URL이됩니다. 이 계획 (로 시작하지만이 http://
, https://
등). 일반 EL에서 기본 컨텍스트 경로를 얻을 수있는 깔끔한 방법이 없으므로 여기서 JSTL에 대한 약간의 도움이 필요합니다 .
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<c:set var="req" value="${pageContext.request}" />
<c:set var="uri" value="${req.requestURI}" />
<c:set var="url">${req.requestURL}</c:set>
...
<head>
<base href="${fn:substring(url, 0, fn:length(url) - fn:length(uri))}${req.contextPath}/" />
<link rel="stylesheet" href="css/default.css" />
<script src="js/default.js"></script>
</head>
<body>
<img src="img/logo.png" />
<a href="page.jsp">link</a>
<form action="servlet"><input type="submit" /></form>
</body>
이것은 다시 (다시) 몇 가지주의 사항이 있습니다. 앵커 ( #identifier
URL)도 기본 경로에 상대적이됩니다! 대신 요청 URL (URI)에 상대적으로 만들고 싶습니다. 그래서 변경
<a href="#identifier">jump</a>
...에
<a href="${uri}#identifier">jump</a>
각 방식마다 장단점이 있습니다. 선택하는 것은 당신에게 달려 있습니다. 적어도이 문제의 원인과 해결 방법을 이제 이해해야합니다. :)
또한보십시오: