Невозможно использовать внешний стиль CSS с JSP
Я просто пытаюсь изучить сервлеты и использовать файлы JSP. Я хотел бы отформатировать стартовую страницу (страницу /login) с помощью внешнего CSS-файла, но мне не удалось это сделать. Он работает с внутренним CSS, вставленным в голову, но это не слишком приятно.
Я запускаю веб-приложение с помощью Docker, это его Dockerfile:
FROM maven:3.9.7-eclipse-temurin-11 AS builder
WORKDIR /app
COPY . /app
RUN mvn clean package
FROM tomcat:9.0.89-jre11-temurin-jammy
COPY --from=builder /app/target/*.war $CATALINA_HOME/webapps/ROOT.war
EXPOSE 8080
CMD ["catalina.sh", "run"]
Вот структура моих файлов:
Это начальная часть моего index.jsp:
<%@ page contentType = "text/html;charset=UTF-8" language = "java" %>
<%@ taglib uri = "http://java.sun.com/jsp/jstl/core" prefix = "c" %>
<html>
<head>
<title>Login</title>
<base href = "${pageContext.request.contextPath}">
<link rel = "stylesheet" type = "text/css" href = "style.css" />
</head>
Я пробовал много вещей, много путей, но мой CSS еще не применен. Например эти:
Невозможно загрузить внешний CSS на страницу JSP
Возможно, я просто что-то в них не заметил, но постарался внимательно прочитать.
Если я могу предоставить что-нибудь, что могло бы приблизить решение, дайте мне знать.
Заранее большое спасибо за вашу помощь.
Ответы 1
Тег <base> не нужен, его можно удалить.
Вы можете использовать тег <c:url>, чтобы создать правильный URL-адрес CSS-файла. Также не путайте статический контент с JSP. В корневой папке веб-приложения создайте подпапку css и добавьте туда файл .css. Затем, если вы добавили правильные файлы библиотеки JSTL в папку lib, вы можете использовать
<link rel = "stylesheet" type = "text/css" href = "<c:url value='/css/style.css'/>">
Кроме того, убедитесь, что у вас есть сопоставление файлов .css с сервлетом Tomcat default, который используется для обслуживания статического контента. В web.xml должно быть
<servlet-mapping>
<servlet-name>default</servlet-name>
<url-pattern>*.css</url-pattern>
</servlet-mapping>
Данное сопоставление сервлетов не является обязательным. Однако если он «исправил» наблюдаемую проблему, то у вас серьезная основная проблема с конфигурацией, и вам нужно будет сделать шаг назад, чтобы сначала исправить ее, а затем вы можете удалить все сопоставление сервлетов. В противном случае ваше приложение тесно связано с конкретной маркой/версией сервера и не является кроссплатформенным.
@BalusC Большое спасибо за комментарий. На самом деле, к сожалению, я был недостаточно осторожен, потому что он работает без сопоставления сервлетов, как вы и написали. Думаю, мне следует лучше понять, почему «root» (уровень index.jsp, index.html и т. д.) нельзя использовать для файлов css, если это так. Теперь он находится в папке css, как было указано выше, теперь без сопоставления сервлетов.
Можно использовать корневую папку, просто укажите на нее <c:url value='/style.css'/>. Абсолютно не имеет значения, в какой папке он находится, если он общедоступен (т. е. его нет в WEB-INF или около того).
Большое спасибо. Оно работает. И все же мне придется прочитать эту тему.