Question

结构为：

src -主要 -资源 --- vue.html --- example.js

vue.html是：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
<!--    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>-->
    <script src="./example.js"></script>

    <script>
        alert("I'm active");


    </script>

这对警报有效：我正在活动

但 404

http://localhost:8080/example.js

但是，它给出了错误。严重错误。

顺便说一下，终点是：

@GetMapping("/vue")
public ModelAndView getAllvue() {

    return new ModelAndView("vue");
}

我去http://localhost:8080/vue，但我不能去

http://localhost:8080/vue.js

它给

Whitelabel Error Page
This application has no explicit mapping for /error, so you are seeing this as a fallback.

但是，以聪明的主意，当我右键单击html并说在浏览器中打开时，它将转到

http://localhost:63343/myproject/templates/vue.html?_ijt=v7rpc3a98pdc66ml94fp8iikn

，我的脚本有效。这是**example.js**

alert("This script will load first");

那么，是什么阻止了我的js工作？

这是安全性配置：

@Configuration
@EnableWebSecurity
//@EnableWebMvc
public class WebSecurity extends WebSecurityConfigurerAdapter {


@Override
protected void configure(HttpSecurity http) throws Exception {

    String[] resources = new String[]{
            "/",
            "/home",
            "/css/**",
            "/icons/**",
            "/images/**",
            "/resources/**",
            "/static/**",
            "/js/**"
    };

  http.csrf().disable();

    http.authorizeRequests()
            .antMatchers(resources).permitAll()
            .and()
            .formLogin()
            .loginPage("/login")
            .loginProcessingUrl("/authenticateTheUser")
            .defaultSuccessUrl("/dashboard")
            .permitAll();
}

我也尝试过：

<script src="./example.js"></script>
<script src="../example.js"></script>
<script src="/example.js"></script>
<script src="templates/example.js"></script>

Answer 1

请尝试以下代码来加载静态文件。

@Configuration
//@EnableWebMvc
public class MvcConfig extends WebSecurityConfigurerAdapter implements WebMvcConfigurer {
    @Override
    public void addResourceHandlers(ResourceHandlerRegistry registry) {
        registry
            .addResourceHandler("/resources/**")
            .addResourceLocations("/resources/");
    }

    @Override
    protected void configure(HttpSecurity http) throws Exception {
        String[] resources = new String[]{
            "/",
                "/home",
                "/css/**",
                "/icons/**",
                "/images/**",
                "/resources/**",
                "/static/**",
                "/js/**"
        };
        http.csrf().disable();
        http.authorizeRequests()
            .antMatchers(resources).permitAll()
            .and()
            .formLogin()
            .loginPage("/login")
            .loginProcessingUrl("/authenticateTheUser")
            .defaultSuccessUrl("/dashboard")
            .permitAll();
    }
}

然后在您的html页面中调用它。


<script src="http://localhost:8080/myproject/resources/vau.js"></script>

希望这可以解决问题。

无法通过春季加载外部脚本js文件

1 个答案: