reactjs - 带有反应的Spring引导继续将css文件读取为（'application / json'）而不是css文件

Question

我正在编写一个使用 spring boot 作为后端和 Reactjs 作为前端的应用程序。我使用 maven-frontend-plugin 将它捆绑/打包到 jar 文件中：但是，当我运行 jar 文件时，我不断收到 403 错误状态，并且它无法应用样式，因为它的 MIME 类型（'application/json'）不是受支持的样式表。

下面是maven-front-plugin 配置

<profiles>
    <profile>
        <id>build-frontend</id>
        <activation>
            <activeByDefault>true</activeByDefault>
        </activation>
        <build>
            <plugins>
                <plugin>
                    <groupId>com.github.eirslett</groupId>
                    <artifactId>frontend-maven-plugin</artifactId>
                    <!-- Use the latest released version:
                              https://repo1.maven.org/maven2/com/github/eirslett/frontend-maven-plugin/ -->
                    <version>1.11.2</version>
                    <configuration>
                        <workingDirectory>src/frontend</workingDirectory>
                        <installDirectory>target</installDirectory>
                    </configuration>
                    <executions>
                        <execution>
                            <id>install node and npm</id>
                            <goals>
                                <goal>install-node-and-npm</goal>
                            </goals>
                            <configuration>
                                <nodeVersion>v14.16.1</nodeVersion>
                                <npmVersion>6.14.12</npmVersion>
                            </configuration>
                        </execution>
                        <execution>
                            <id>npm install</id>
                            <goals>
                                <goal>npm</goal>
                            </goals>
                            <configuration>
                                <arguments>install</arguments>
                            </configuration>
                        </execution>
                        <execution>
                            <id>npm run build</id>
                            <goals>
                                <goal>npm</goal>
                            </goals>
                            <configuration>
                                <arguments>run build</arguments>
                            </configuration>
                        </execution>
                    </executions>
                </plugin>
                <plugin>
                    <groupId>org.apache.maven.plugins</groupId>
                    <artifactId>maven-resources-plugin</artifactId>
                    <version>3.2.0</version>
                    <executions>
                        <execution>
                            <id>copy-build-folder</id>
                            <phase>process-classes</phase>
                            <goals>
                                <goal>copy-resources</goal>
                            </goals>
                            <configuration>
                                <resources>
                                    <resource>
                                        <directory>src/frontend/build</directory>
                                    </resource>
                                </resources>
                                <outputDirectory>
                                    ${project.build.outputDirectory}/static
                                </outputDirectory>
                            </configuration>
                        </execution>
                    </executions>
                </plugin>
            </plugins>
        </build>
    </profile>
</profiles>

下面是访问 ass css、js 等文件的 WebSecurityConfig 设置。

  protected void configure(HttpSecurity http) throws Exception {
    http
            .csrf().and().csrf().disable()

            .authorizeRequests()
            .antMatchers("/css/**", "/js/**","/images/**", "/weather/**").permitAll()
            .antMatchers("/media/**", "**/favicon.ico", "/", "/index").permitAll()
            .antMatchers("/employee/addNewEmployee").permitAll()
            .and()
            .sessionManagement().sessionCreationPolicy(SessionCreationPolicy.STATELESS)
            .and()
            .addFilter(new JwtUsernameAndPasswordAuthFilter(authenticationManager(), securityKey, secretKey, authRepository, passwordEncoder()))
            .addFilterAfter(new JwtAuthVerifier(securityKey, secretKey), JwtUsernameAndPasswordAuthFilter.class)
            .authorizeRequests()
            .antMatchers("/auth_management/**").hasRole(ADMINISTRATOR.name())
            .antMatchers("/employee/**").hasRole(ADMINISTRATOR.name())
            .anyRequest()
            .authenticated();
}

下面是我收到的错误消息的屏幕截图。

标签： reactjsspring-boot