1.Refused to apply style because its MIME type ('application/json') is not a supported
原因是在引入css文件是采用的是webjars的方式
pom中:
<!--bootstrap--> <dependency> <groupId>org.webjars</groupId> <artifactId>bootstrap</artifactId> <version>4.5.0</version> </dependency> <dependency> <groupId>org.webjars</groupId> <artifactId>jquery</artifactId> <version>3.5.1</version> </dependency> <dependency> <groupId>net.sourceforge.nekohtml</groupId> <artifactId>nekohtml</artifactId> </dependency>
而且是集成了SpringSecurity, 资源被拦截了, 修改config配置, 添加第12行的代码, 如下:
1 package com.xgcd.oauth2.config; 2 3 import org.springframework.context.annotation.Configuration; 4 import org.springframework.web.servlet.config.annotation.ResourceHandlerRegistry; 5 import org.springframework.web.servlet.config.annotation.WebMvcConfigurationSupport; 6 7 @Configuration 8 public class WebMvcConfig extends WebMvcConfigurationSupport { 9 @Override 10 protected void addResourceHandlers(ResourceHandlerRegistry registry) { 11 registry.addResourceHandler("/static/**").addResourceLocations("classpath:/static/"); 12 registry.addResourceHandler("/webjars/**").addResourceLocations("classpath:/META-INF/resources/webjars/"); 13 super.addResourceHandlers(registry); 14 } 15 }
SecurityConfig.java中添加/webjars/** :
1 @Override 2 protected void configure(HttpSecurity http) throws Exception { 3 http.antMatcher("/oauth/**") 4 .authorizeRequests() 5 .antMatchers("/oauth/**", "/static/**", "/webjars/**") 6 .permitAll() 7 .and() 8 .csrf().disable(); 9 } 10 11 @Override 12 public void configure(WebSecurity web) throws Exception { 13 web.ignoring() 14 .antMatchers("/static/**", "/webjars/**"); 15 super.configure(web); 16 }
另外, html引入css文件在<head>中
<link rel="stylesheet" th:href="@{/webjars/bootstrap/4.5.0/css/bootstrap.min.css}" type="text/css">
2.此外js文件也是出现401的问题
修改成相同的引用方式
<!DOCTYPE html> <html lang="en" xmlns:th="http://www.thymeleaf.org"> <head> <meta charset="UTF-8"> <title>login</title> <link rel="shortcut icon" href="/static/favicon.ico" type="image/x-icon"> <link rel="stylesheet" th:href="@{/webjars/bootstrap/4.5.0/css/bootstrap.min.css}" type="text/css"> <script th:src="@{/webjars/jquery/3.5.1/jquery.min.js}" type="text/javascript"></script> <script th:src="@{/webjars/bootstrap/4.5.0/js/bootstrap.min.js}" type="text/javascript"></script> <!-- <link rel="stylesheet" th:href="@{static/css/bootstrap.min.css}" type="text/css">--> </head> <body> <div class="container"><br/> <div class="alert alert-success"> <a href="#" class="close" data-dismiss="alert" aria-label="close">×</a> Hello, <strong>webjars!</strong> </div> </div> </body> </html>
3.favicon.ico出现401问题
首先, 在html中的<head>中添加
<link rel="shortcut icon" href="/static/favicon.ico" type="image/x-icon">
另外, 资源未被放行,修改config配置资源路径, 将:
registry.addResourceHandler("/**").addResourceLocations("classpath:/static/");
修改为:
registry.addResourceHandler("/static/**").addResourceLocations("classpath:/static/");
4.html中很少出现采用固定版本号, 如何隐藏版本号
<!--webjars-locator,省略代码中的硬编码版本号--> <dependency> <groupId>org.webjars</groupId> <artifactId>webjars-locator-core</artifactId> <version>0.32</version> </dependency>
这种方式并没有起作用, 有懂的欢迎拍砖
其他
webjars问题
https://blog.csdn.net/qq_16307345/article/details/78084754?utm_source=blogxgwz5
资源放行
http://www.itboyhub.com/2020/0528/springsecurity-ignoring.html
https://blog.csdn.net/c4jem/article/details/77131422
Security拦截规则
https://blog.csdn.net/panchang199266/article/details/90579029
favicon问题
https://blog.csdn.net/u012217533/article/details/46368251
https://www.cnblogs.com/murphyzhang/p/12298912.html
静态文件引入路径@{}写法
https://blog.csdn.net/nangeali/article/details/82432894
webjars汇总
https://blog.csdn.net/chao_1990/article/details/53449494
https://www.jianshu.com/p/66d1b35bcd9d
https://www.jianshu.com/p/ca568526f0bd
https://blog.coding.net/blog/spring-static-resource-process(推荐)