Boa tarde!
Estou fazendo alguns testes com Spring MVC e JSP Template e não consegui incluir o CSS, testei algumas formas, mas ele dá erro 404 (no console) para o arquivo .css
Meu projeto tem a seguinte estrutura:
WEB-INF >
ressources >
css
reset.css
tags >
pageTemplate.jsp
views >
cadastro >
form-pessoa.jsp
cabecalho.jsp
rodape.jsp
home.jsp
Tentei incluir a referencia:
<link rel="stylesheet" href="/resources/css/reset.css" />
no head do pageTemplate ou no form-pessoa, mas não funcionou… Como posso incluir corretamente?
pageTemplate.jsp
<%@ attribute name="titulo" required="true" %>
<%@ attribute name="bodyClass" required="false" %>
<%@ attribute name="extraScripts" fragment="true" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>${titulo } - Controle de Peso</title>
</head>
<body class="${bodyClass}" >
<%@ include file="/WEB-INF/views/cabecalho.jsp" %>
<jsp:doBody />
<jsp:invoke fragment="extraScripts"></jsp:invoke>
<%@ include file="/WEB-INF/views/rodape.jsp" %>
</body>
</html>
form-pessoa.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://www.springframework.org/tags" prefix="s"%>
<%@ taglib uri="http://www.springframework.org/tags/form" prefix="form"%>
<%@ taglib tagdir="/WEB-INF/tags" prefix="tags"%>
<c:url value="/" var="contextPath" />
<tags:pageTemplate titulo="Cadastro de Pessoa">
<jsp:body>
<h1>Dados Pessoais</h1>
<form:form action="enviaPessoa" method="post">
<label for="nome">Nome: </label>
<input type="text" name="nome" required/>
<label for="dataNascimento">Data Nascimento: </label>
<input name="dataNascimento" type="date" required>
<fieldset>
<legend>Altura: </legend>
<input type="range" id="vol" name="vol" value="0" min="0.30" max="2.50" step="0.01"
oninput="altura.value=value" onchange="altura.value=value">
<input type="text" id="altura" name="altura" oninput="vol.value=value" onchange="vol.value=value" readonly>
</fieldset>
<fieldset>
<legend>Sexo: </legend>
<select name="sexo">
<option selected disabled>Selecione...</option>
<option value="Masculino">Masculino</option>
<option value="Feminino">Feminino</option>
</select>
</fieldset>
<input type="submit" value="Enviar cadastro" />
</form:form>
</jsp:body>
</tags:pageTemplate>
Acredito que isso esteja acontecendo pq sua pasta de recursos está dentro de WEB-INF. Essa pasta não aceita requisições. Experimente colocá-la na pasta webapp.
Obrigado!
FIz alguns testes, mas não funcionou, subi a pasta para debaixo do webapp, mesmo nível do WEB-INF.
Tentei incluir no pageTemplate com os seguintes apontamentos, nenhum funcionou:
<link rel="stylesheet" href="../resources/css/reset.css" />
<link rel="stylesheet" href="/../resources/css/reset.css" />
<link rel="stylesheet" href="./resources/css/reset.css" />
<link rel="stylesheet" href="resources/css/reset.css" />
<link rel="stylesheet" href="/resources/css/reset.css" />
<link rel="stylesheet" href="webapp/resources/css/reset.css" />
<link rel="stylesheet" href="/webapp/resources/css/reset.css" />
<link rel="stylesheet" href="../webapp/resources/css/reset.css" />
<link rel="stylesheet" href="/../webapp/resources/css/reset.css" />
<link rel="stylesheet" href="./webapp/resources/css/reset.css" />
O correto seria incluir no pageTemplate.tag mesmo, certo?
Tente agora adicionar essa linha no arquivo de configuraçao servlet.xml:
<resources mapping="/resources/**" location="/resources/">
Vou tentar… Obrigado!
Minha configuração está toda em classe Java, vou verificar como incluir esse mapeamento via código.
Obrigado!
1 curtida
@vicentingr Não achei como fazer essa mapeamento via código java, mas consegui fazer funcionar, não sei se é o jeito certo ou um tipo de gambi, mas deu certo incluindo no head do pageTemplate.jsp
<style>
<%@include file="/resources/css/reset.css"%>
<%@include file="/resources/css/cabecalho.css"%>
</style>
1 curtida
já tentou acessar os links por meio da c:url?
,
<link rel="stylesheet" href="<c:url value="webapp/resources/css/reset.css"/>" />
,
usa este código em todos os links.
e se mesmo assim não estiver a dar certo.
verifica a tags no xml se o caminho está correto…
Desta forma não funcionou…
Inclui no pageTemplate:
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<c:url value="/" var="contextPath" />
e
<link rel="stylesheet" type="text/css" href="<c:url value="webapp/resources/css/reset.css"/>" >
<link rel="stylesheet" type="text/css" href="<c:url value="webapp/resources/css/cabecalho.css"/>" >
No inspecionar consta o seguinte erro:
1. Request URL:
http://localhost:8080/webapp/resources/css/reset.css
2. Request Method:
GET
3. Status Code:
404
4. Remote Address:
[::1]:8080
5. Referrer Policy:
no-referrer-when-downgrade
1. Response Headersview source
1. Connection:
keep-alive
2. Content-Language:
pt-BR
3. Content-Length:
763
4. Content-Type:
text/html;charset=utf-8
5. Date:
Tue, 07 Apr 2020 00:38:10 GMT
6. Keep-Alive:
timeout=20
<link rel="stylesheet" type="text/css" href="<c:url value="/webapp/resources/css/cabecalho.css"/>
O link estava a faltar uma barra invertida.
podes me mostrar qual é o caminho do resource ai no xml? talvez o erro esteja na declaração do resource ai no seu xml.
Minha classe ServletSpringMVC
public class ServletSpringMVC extends AbstractAnnotationConfigDispatcherServletInitializer {
@Override
protected Class<?>[] getRootConfigClasses() {
return new Class[] { SecurityConfiguration.class, AppWebConfiguration.class, JPAConfiguration.class };
}
@Override
protected Class<?>[] getServletConfigClasses() {
return new Class[] {};
}
@Override
protected String[] getServletMappings() {
return new String[] { "/" };
}
}
Classe AppWebConfiguration
@EnableWebMvc
@ComponentScan(basePackageClasses = { HomeController.class, PesoDAO.class, Usuario.class })
public class AppWebConfiguration extends WebMvcConfigurerAdapter {
@Autowired
private RequestMappingHandlerAdapter requestMappingHandlerAdapter;
@Bean
public InternalResourceViewResolver internalResourceViewResolver() {
InternalResourceViewResolver resolver = new InternalResourceViewResolver();
resolver.setPrefix("/WEB-INF/views/");
resolver.setSuffix(".jsp");
return resolver;
}
@Bean
public MessageSource messageSource() {
ReloadableResourceBundleMessageSource messageSource = new ReloadableResourceBundleMessageSource();
messageSource.setBasename("/WEB-INF/messages");
messageSource.setDefaultEncoding("UTF-8");
messageSource.setCacheSeconds(1);
return messageSource;
}
@PostConstruct
public void init() {
requestMappingHandlerAdapter.setIgnoreDefaultModelOnRedirect(true);
}
}
Olha só agora que notei um pequeno erro no caminho.
no href diz resources e o pasta está com nome de ressources.
e faltam um metodo na class AppWebConfiguration, este método se encarrega de verificar qual a pasta de resource onde está os arquivos meios externos.
o methodo é como este, para registar o resource de sua aplicação…
@Override
public void addResourceHandlers(ResourceHandlerRegistry registry) {
registry.addResourceHandler("/resources/**")
.addResourceLocations("/public-resources/")
.setCacheControl(CacheControl.maxAge(1, TimeUnit.HOURS).cachePublic());
}
1 curtida
@eliseu2203 Muuuuuuuito Obrigado!
Funcionou!
Inclui no AppWebConfiguration
@Override
public void addResourceHandlers(ResourceHandlerRegistry registry) {
registry.addResourceHandler("*.css").addResourceLocations("/resources/css/");
}
E a pageTemplate ficou assim:
<link rel="stylesheet" type="text/css" href="reset.css">
<link rel="stylesheet" type="text/css" href="cabecalho.css"
Inclusive a importação de imagens no código funcionou também, inclui o
registry.addResourceHandler("*.png").addResourceLocations("/resources/images/");
E da mesma forma que o CSS, as imagens estão funcionando.
Obrigado!
1 curtida
Boa continuação ai…
só te faltava mesmo o método e alterar o resources q estava com outro nome.
1 curtida