Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

Não consigo usar JS/CSS nas minhas views

Boa noite, estou construindo uma aplicação com Spring MVC na qual quero integrar com um front-end feito em Angular, porém não consigo utilizar meus arquivos CSS do bootstrap, nem importar os scripts do angular. Ao carregar a página no navegador, recebo o seguinte erro :

GET http://localhost:8080/desafiob/css/bootstrap.min.css net::ERR_ABORTED
GET http://localhost:8080/desafiob/css/bootstrap-theme.min.css net::ERR_ABORTED
GET http://localhost:8080/resources/js/main.js net::ERR_ABORTED
GET http://localhost:8080/resources/js/lib/angular.min.js net::ERR_ABORTED
GET http://localhost:8080/resources/js/main.js 404 (Not Found)

Minha index é a seguinte:

<%@ page language="java"
    contentType="text/html; text/javascript; text/css charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html ng-app="TesteApp">
<head>
<meta charset="UTF-8">
<title>Registerpic</title>
<link rel="stylesheet" href="../resources/css/bootstrap.min.css">
<link rel="stylesheet" href="../resources/css/bootstrap-theme.min.css">
<script src="../resources/js/lib/angular.min.js"></script>
<script src="../resources/js/main.js"></script>
</head>
<body>
    <div class="container">
        <div class="jumbotron">
            <h1 class="text-center">Registros</h1>
            <h3 class="text-center">Receitas de Despesas</h3>
        </div>
        <div ng-controller="TesteController">
            <h1>Testando se o angular está funcionando:</h1>
            <p>Olá {{usuario}}!</p>
            <p>1 + 2 = {{1 + 2}}</p>
        </div>
    </div>

</body>
</html>

e minha classe de configuração do spring:


@Configuration
@EnableWebMvc
@ComponentScan(basePackageClasses = { HomeController.class, RegistroDAO.class })
public class AppWebConfiguration extends WebMvcConfigurerAdapter {

    @Bean
    public InternalResourceViewResolver internalResourceViewResolver() {
        InternalResourceViewResolver resolver = new InternalResourceViewResolver();
        resolver.setPrefix("/views/");
        resolver.setSuffix(".jsp");

        return resolver;
    }

     @Override
        public void configureDefaultServletHandling(DefaultServletHandlerConfigurer configurer) {
            configurer.enable();
        }
}

Alguém poderia me ajudar ?

2 respostas

Depois de muito sofrimento, descobri uma forma de fazer funcionar, adicionanto a tag do spring:

<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>

e as demais tags

<spring:url value="/resources/css/bootstrap.min.css" var="bootstrap"></spring:url>
<spring:url value="/resources/css/bootstrap-theme.min.css" var="bootstrapTheme"></spring:url>
<spring:url value="/resources/js/lib/angular.min.js" var="angularJs"></spring:url>
<spring:url value="/resources/js/main.js" var="mainJs"></spring:url>

na index.jsp e mudando minha classe de configuração para a seguinte forma:

@Configuration
@EnableWebMvc
@ComponentScan(basePackageClasses = { HomeController.class, RegistroDAO.class })
public class AppWebConfiguration extends WebMvcConfigurationSupport  {

    @Bean
    public InternalResourceViewResolver internalResourceViewResolver() {
        InternalResourceViewResolver resolver = new InternalResourceViewResolver();
        resolver.setPrefix("/WEB-INF/views/");
        resolver.setSuffix(".jsp");

        return resolver;
    }

     @Override
        public void configureDefaultServletHandling(DefaultServletHandlerConfigurer configurer) {
            configurer.enable();
        }

     @Override
        public void addResourceHandlers(final ResourceHandlerRegistry registry) {
            registry.addResourceHandler("/resources/**").addResourceLocations("/resources/");
        }

     @Override
        @Bean
        public HandlerMapping resourceHandlerMapping() {
            AbstractHandlerMapping handlerMapping = (AbstractHandlerMapping) super.resourceHandlerMapping();
            handlerMapping.setOrder(-1);
            return handlerMapping;
        }

}

Porém, como sou iniciante em Spring, não tenho certeza se este é o modo mais eficiente/correto de resolver isso ou se foi mais uma "gambiarra".

Alguém mais experiente pode me dizer se existe uma forma mais eficiente e simples de resolver isto ou esta é a forma correta? Obrigado a todos! :D

solução!

Esse é um jeito ok sim. O problema era justamente o endereço dos recursos, aquele seu ../ não estava funcionando como você esperava. Com essa tag você está definindo o endereço relativo a raiz do seu projeto.

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software