springboot集成bootstrap遇到的问题

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>