2016-07-24 37 views
0

我使用的是spring引导并试图托管使用角度js的HTML页面。 我的文件夹结构是:My Folder Structure将.js,.css文件提供给html模板的弹簧引导404错误

我提到了很多关于SO的其他问题,甚至spring.io指南在spring启动时,我的理解是我们应该将我们的html模板保留在templates文件夹中, .css,图像,.js文件在静态文件夹中。我也做了同样的事情,但是每当页面加载时,只有html被渲染,浏览器会获得所有.css和.js文件的404。

我包括我以下列方式HTML .cs​​s和.js文件:

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

我试着像所有的组合: SRC =” ../静态/ JS/socket.io /插座.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> 
+0

看起来应该是正确的,因为我的设置是这样的,我不需要参考静态。我正在使用Freemarker模板,其中一些有Angular,它的工作原理。你可以分享你的项目的POM文件吗? –

+0

是啊当然,编辑完成显示POM文件,@ RobBaily请检查! –

+0

请显示您的InternalResourceViewResolver(xml或java) –

回答

0

我看你使用thymeleaf所以要尽量像这样访问你的资源:

<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。

+1

对不起,我不得不这样做,我已经删除了thymleaf,因为我使用的是用于UI的angularjs。 –

0

我发现这个问题,一切正常,但: 1)我没有扩展我的应用程序类从WebMvcAutoConfiguration。

@SpringBootApplication 
@EnableWebMvc 
public class HLACUIApplication extends WebMvcAutoConfiguration { 

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

} 

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

2)我不需要使用模板文件夹,因为我使用的是angularjs而不是thymeleaf。我已将所有内容放在静态文件夹中。

0
I'm also facing same issue. I think you are having html code like below: 

<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> 


> I solve this is by just adding type="text/javascript". In spring boot application it's required to define type="text/javascript" otherwise it's not going to load. It'll say https:localhost:8081/js/Script.js etc error 
Solution for your Example 

    <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> 
> If you are building springboot application. Then you are will have your static contain in :src/main/resources/static". Then we'll create js, css etc file and store our css as well as javascript file. 
    In this case we'll define css and javascript as below: 

    <link href="css/styles.css" rel="stylesheet"> 
    <script type="text/javascript" src="js/myScript.js"></script>