Spring 版本 4.3.2 maven項目javascript
1.首先上項目目錄圖,主要用到的配置文件,略去css和js的文件css
引包:html
2.主要代碼:java
(1)NetpageWebAppInitializer類web
package config; import org.springframework.web.servlet.support.AbstractAnnotationConfigDispatcherServletInitializer; /** *@author 做者 Yu chenchen *@version 建立時間:2016年12月1日 下午4:46:20 *類說明:該類會自動的配置DispatcherServlet和spring應用上下文,spring的應用上下文會位於應用程序的Servlet上下文之中 */ public class NetpageWebAppInitializer extends AbstractAnnotationConfigDispatcherServletInitializer { //將DispatcherServlet映射到"/",處理全部的請求 @Override protected String[] getServletMappings() { // TODO Auto-generated method stub return new String[]{"/"}; } //返回的帶有@Configuration註解的類將會用來配置ContextLoaderListener建立的應用上下文中的bean @Override protected Class<?>[] getRootConfigClasses() { // TODO Auto-generated method stub return new Class<?>[]{RootConfig.class}; } //返回帶有@Configuration註解的類將會用來定義DispatcherServlet應用上下文中的bean @Override protected Class<?>[] getServletConfigClasses() { // TODO Auto-generated method stub return new Class<?>[]{WebConfig.class}; } }
(2)WebConfig類spring
package config; import org.springframework.context.annotation.Bean; import org.springframework.context.annotation.ComponentScan; import org.springframework.context.annotation.Configuration; import org.springframework.web.servlet.ViewResolver; import org.springframework.web.servlet.config.annotation.DefaultServletHandlerConfigurer; import org.springframework.web.servlet.config.annotation.EnableWebMvc; import org.springframework.web.servlet.config.annotation.WebMvcConfigurerAdapter; import org.springframework.web.servlet.view.InternalResourceViewResolver; /** *@author 做者 Yu chenchen *@version 建立時間:2016年12月1日 下午5:13:20 *類說明: */ @Configuration @EnableWebMvc //啓用Spring MVC @ComponentScan(basePackages={"web"})//自動掃描包web下的全部控制器 public class WebConfig extends WebMvcConfigurerAdapter { //配置jsp視圖解析器 @Bean public ViewResolver viewResolver(){ InternalResourceViewResolver resolver=new InternalResourceViewResolver(); resolver.setPrefix("/jsp/");//設置視圖路徑 resolver.setSuffix(".jsp"); resolver.setExposeContextBeansAsAttributes(true); return resolver; } //配置靜態資源的處理 @Override public void configureDefaultServletHandling( DefaultServletHandlerConfigurer configurer) { // TODO Auto-generated method stub configurer.enable(); super.configureDefaultServletHandling(configurer); } }
(3)RootConfig類後端
package config; import org.springframework.context.annotation.ComponentScan; import org.springframework.context.annotation.ComponentScan.Filter; import org.springframework.context.annotation.Configuration; import org.springframework.context.annotation.FilterType; import org.springframework.web.servlet.config.annotation.EnableWebMvc; /** *@author 做者 Yu chenchen *@version 建立時間:2016年12月1日 下午4:55:11 *類說明: */ @Configuration @ComponentScan(basePackages={"config"}, excludeFilters={@Filter(type=FilterType.ANNOTATION,value=EnableWebMvc.class)} ) //配置非web的組件,一般是後端的中間層和數據層組件 public class RootConfig { }
(4)HomeController類app
package web; import org.springframework.stereotype.Controller; import org.springframework.web.bind.annotation.RequestMapping; import static org.springframework.web.bind.annotation.RequestMethod.*;; /** *@author 做者 Yu chenchen *@version 建立時間:2016年12月1日 下午5:39:53 *類說明: */ @Controller public class HomeController { //配置對"/"的請求 @RequestMapping(value="/",method=GET) public String goHome(){ return "home";//返回視圖名 } }
(5)home.jspwebapp
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <link rel="stylesheet" type="text/css" href="css/test1.css"> </head>
<!--toolbar--> <body> <div id="toolbar" class="ss"> <div class="s0"> <div class="login" > <div class="logo"><img src="img/toolbar_logo.png"></img> </div> <input class="s1" placeholder="輸入帳號"> <input class="s2" > <input type="button" class="button1" value="登錄"> <a href="#" class="s3">註冊</a> </div> <div class="email"> <a href="#" >郵件</a></div> <div class="email"> <a href="#" >說兩句</a></div> <div class="s4"> <a href="#"><img src="img/sohunewsapp2.jpg"></a></div> </div> </div> <!-- 主要頁面 --> <div class="main"> <!-- 第一行部分 導航--> <div class="nav"></div> <!-- 第二部分 搜索欄--> <div class="search"></div> <!-- 第三部分 新聞內容--> <div class="content"></div> </div> </body> <script type="text/javascript" src="js/test1.js"></script> </html>
注意事項:將項目根路徑映射到webapp下,否則會找不到資源。jsp
3. 測試