Question

我正在使用spring boot并且正在尝试托管使用角度js的HTML页面。我的文件夹结构是：

我提到了关于SO的很多其他问题，甚至spring.io关于spring boot的指南以及我的理解是我们应该将我们的html模板保存在模板文件夹和所有.css，images，.js文件中在静态文件夹中。我也做了同样的事情，但每当页面加载时，只会呈现html，浏览器会为所有.css和.js文件获取404.

我在HTML中以下列方式包含.css和.js：

<script src="/js/socket.io/socket.io.js"></script>
<script src="/js/moment.min.js"></script>
<script src="/js/demoApp.js"></script>

我尝试了所有组合，如： src =“../ static / js / socket.io / socket.io.js”或src =“js / socket.io / socket.io.js” 但是我总是在浏览器中获得404这些文件。

我检查了春季启动日志，这就是它所说的：

2016-07-24 21:08:05 WARN  PageNotFound:1139 - No mapping found for HTTP request with URI [/js/demoApp.js] in DispatcherServlet with name 'dispatcherServlet'
2016-07-24 21:08:05 DEBUG DispatcherServlet:997 - Successfully completed request

我无法理解如何解决问题，请帮助!!!

注意：我没有编写视图解析器代码，因为根据我的理解，spring boot会自动从静态文件夹中获取静态内容。如果我错了，请纠正我。

编辑：添加我的pom文件：

    <parent>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-parent</artifactId>
        <version>1.3.5.RELEASE</version>
    </parent>
    <dependencies>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-web</artifactId>
            <exclusions>
                <exclusion>
                    <groupId>org.springframework.boot</groupId>
                    <artifactId>spring-boot-starter-logging</artifactId>
                </exclusion>
            </exclusions>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-log4j</artifactId>
        </dependency>
        <!--Alexa Dependencies -->
        <dependency>
            <groupId>org.apache.commons</groupId>
            <artifactId>commons-lang3</artifactId>
            <version>3.3.2</version>
            <scope>compile</scope>
        </dependency>
        <dependency>
            <groupId>org.apache.directory.studio</groupId>
            <artifactId>org.apache.commons.io</artifactId>
            <version>2.4</version>
            <scope>compile</scope>
        </dependency>
        <dependency>
            <groupId>com.amazon.alexa</groupId>
            <artifactId>alexa-skills-kit</artifactId>
            <version>1.1</version>
        </dependency>
        <dependency>
            <groupId>com.amazonaws</groupId>
            <artifactId>aws-lambda-java-core</artifactId>
            <version>1.0.0</version>
            <scope>compile</scope>
        </dependency>
        <dependency>
            <groupId>com.amazonaws</groupId>
            <artifactId>aws-java-sdk-dynamodb</artifactId>
            <version>1.9.40</version>
        </dependency>

    </dependencies>
    <build>
        <plugins>
            <plugin>
                <groupId>org.springframework.boot</groupId>
                <artifactId>spring-boot-maven-plugin</artifactId>
            </plugin>
            <plugin>
                <groupId>org.apache.maven.plugins</groupId>
                <artifactId>maven-compiler-plugin</artifactId>
                <configuration>
                    <verbose>true</verbose>
                    <source>1.8</source>
                    <target>1.8</target>
                    <showWarnings>true</showWarnings>
                </configuration>
            </plugin>
        </plugins>
    </build>

Answer 1

我发现你正在使用百里香，所以尝试访问你的资源：

<script th:src="@{/js/socket.io/socket.io.js}"></script>
<script th:src="@{/js/moment.min.js}"></script>
<script th:src="@{/js/demoApp.js}"></script>

此外，如果这不起作用，您可以添加index.html。

Answer 2

我发现了问题，一切都是正确的但是： 1）我没有从WebMvcAutoConfiguration扩展我的Application类。

@SpringBootApplication
@EnableWebMvc
public class HLACUIApplication extends WebMvcAutoConfiguration {

    public static void main(String[] args) {
        SpringApplication.run(HLACUIApplication.class, args);
    }

}

应用程序类应该是这样的。

2）我不需要使用模板文件夹，因为我使用的是angularjs而不是thymeleaf。我把所有东西放在静态文件夹中。

Answer 3

我遇到了同样的问题。我认为你的代码如下html：

<html xmlns:th="http://www.thymeleaf.org">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
    <title>Insert title here</title>

    <!-- Main Styles -->
    <link rel="stylesheet" href="/css/bar.css" />
    <script src="/js/foo.js"></script>

    </head>
    <body>
        <div>Welcome to Foo!</div>
    </body>
    </html>

我通过将type="text/javascript"添加到<script>元素来解决了这个问题。在Spring Boot个应用中，需要定义type="text/javascript"，否则无法加载。

您的示例的解决方案如下所示：

    <html xmlns:th="http://www.thymeleaf.org">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
    <title>Insert title here</title>

    <!-- Main Styles -->
    <link rel="stylesheet" href="/css/bar.css" />
    <script type="text/javascript" src="/js/foo.js"></script>

    </head>
    <body>
        <div>Welcome to Foo!</div>
    </body>
    </html>

Answer 4

就我的百里香而言，当我在'js'之前跳过'/'时很有帮助。

示例，而不是

<script src="/js/demoApp.js"></script>

我放了

<script src="js/demoApp.js"></script>

Answer 5

如果您使用的是 Eclipse IDE，请右键单击项目属性/项目构面

将.js，.css文件提供给html模板时出现spring-boot 404错误

5 个答案: