我无法在 thymeleaf 页面中加载资源(如 .css .js)。它们返回 200，但返回为空 html 文件。我在控制台中看到此错误
Uncaught SyntaxError: Unexpected token < bootstrap.min.js
因为正如我所说，它返回空白 html。如果我在浏览器(localhost/js/bootstrap.min.js)上打开此资源，我会得到此页面
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
</body>
</html>
Web安全配置
@Override
protected void configure(HttpSecurity http) throws Exception {
http
.authorizeRequests()
.antMatchers(
"/",
"/js/**",
"/css/**",
"/img/**",
"/charts/**",
"/images/**",
"/jquery.cookie/**",
"/fonts/**",
"/font-awesome/**",
"/bootstrap/**",
"/webjars/**").permitAll()
.antMatchers("/dashboard/**").hasRole("ADMIN")
.anyRequest().authenticated()
.and()
.formLogin()
.loginPage("/login")
.permitAll()
.and()
.logout()
.invalidateHttpSession(true)
.clearAuthentication(true)
.logoutRequestMatcher(new AntPathRequestMatcher("/logout"))
.logoutSuccessUrl("/login?logout")
.permitAll()
.and()
.exceptionHandling()
.accessDeniedHandler(accessDeniedHandler);
docker-compose
nginx:
container_name: some-nginx
image: nginx:1.13
restart: always
ports:
- 80:80
- 443:443
volumes:
- ./nginx/conf.d:/etc/nginx/conf.d
depends_on:
- app
networks:
- postgres-compose-network
postgresql:
container_name: psql_db
image: postgres:11.4
volumes:
- psql_db:/var/lib/postgresql/data
environment:
- POSTGRES_PASSWORD=passwd
- POSTGRES_USER=commegram_user
- POSTGRES_DB=commegram_db
- PGDATA=/var/lib/postgresql/data
ports:
- "15432:5432"
networks:
- postgres-compose-network
app:
restart: always
build: .
working_dir: /app
volumes:
- ./:/app
expose:
- "8080"
- "8081"
command: mvn clean spring-boot:run
depends_on:
- postgresql
networks:
- postgres-compose-network
volumes:
psql_db: {}
networks:
postgres-compose-network:
driver: bridge
资源树
src/main/resources/
├── application.properties
├── static
│ ├── bootstrap
│ │ ├── bootstrap.min.css
│ │ └── bootstrap.min.js
│ ├── charts
│ │ └── Chart.min.js
│ ├── css
│ │ ├── custom.css
│ │ ├── custom.min.css
│ │ ├── font.css
│ │ ├── main.css
│ │ └── style.default.css
│ ├── font-awesome
│ │ ├── font-awesome.min.css
│ │ └── fonts
│ │ ├── FontAwesome.otf
│ │ ├── fontawesome-webfont.eot
│ │ ├── fontawesome-webfont.svg
│ │ ├── fontawesome-webfont.ttf
│ │ ├── fontawesome-webfont.woff
│ │ └── fontawesome-webfont.woff2
│ ├── fonts
│ │ ├── dark-dashboard.eot
│ │ ├── dark-dashboard.svg
│ │ ├── dark-dashboard.ttf
│ │ ├── dark-dashboard.woff
│ │ ├── fontawesome-webfont.ttf
│ │ ├── fontawesome-webfont.woff
│ │ └── fontawesome-webfont.woff2
│ ├── images
│ │ ├── american-express.png
│ │ ├── cropper.jpg
│ │ ├── img.jpg
│ │ ├── inbox.png
│ │ ├── mastercard.png
│ │ ├── media.jpg
│ │ ├── paypal.png
│ │ ├── picture.jpg
│ │ ├── prod-1.jpg
│ │ ├── prod-2.jpg
│ │ ├── prod-3.jpg
│ │ ├── prod-4.jpg
│ │ ├── prod-5.jpg
│ │ ├── user.png
│ │ └── visa.png
│ ├── img
│ │ ├── avatar-6.jpg
│ │ └── favicon.ico
│ ├── jquery.cookie
│ │ └── jquery.cookie.js
│ └── js
│ ├── charts-home.js
│ ├── custom.js
│ ├── custom.min.js
│ └── front.js
├── templates
│ ├── dashboard.html
│ ├── fragments
│ │ ├── fragment-footer-content.html
│ │ ├── fragment-menu-footer-buttons.html
│ │ ├── fragment-menu-profile-quick-info.html
│ │ ├── fragment-sidebar-menu.html
│ │ ├── fragment-top-navigation.html
│ │ └── layout.html
│ ├── index.html
│ ├── login-default.html
│ ├── login.html
│ └── registration.html
└── validation.properties
最佳答案
我认为你的问题是
.antMatchers(
"/",
"/js/**",
"/css/**",
"/img/**",
"/charts/**",
"/images/**",
"/jquery.cookie/**",
"/fonts/**",
"/font-awesome/**",
"/bootstrap/**",
"/webjars/**").permitAll()
请删除此代码并添加一个额外的方法void configure(WebSecurity web)，如下所示
@Override
public void configure(WebSecurity web) throws Exception {
web.ignoring()
.antMatchers(
"/js/**",
"/css/**",
"/img/**",
"/charts/**",
"/images/**",
"/jquery.cookie/**",
"/fonts/**",
"/font-awesome/**",
"/bootstrap/**",
"/webjars/**"
);
}
希望它能解决您的问题...
关于java - Spring资源返回空白html页面，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/57261785/