SpringBoot整合系列-整合SpringMVC
摘要：
原創作品，可以轉載，但是請標註出處地址：https://www.cnblogs.com/V1haoge/p/9984607.html
SpringBoot整合Spring MVC
步驟
第一步：新增必要依賴
<dependency>
<...
原創作品，可以轉載，但是請標註出處地址：ofollow,noindex" target="_blank">https://www.cnblogs.com/V1haoge/p/9984607.html
SpringBoot整合Spring MVC
步驟
第一步：新增必要依賴
<dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-web</artifactId> </dependency>
第二步：新增必要的配置
無
第三步：新增必要的配置類
SpringBoot整合SpringMVC沒有必需的配置類，只有在想要自定義的時候新增一些實現了WebMvcConfigurer介面的配置類
@Configuration
public class WebMvcConfig implements WebMvcConfigurer {
// 新增針對swagger的處理，避免swagger404
@Override
public void addResourceHandlers(ResourceHandlerRegistry registry) {
registry.addResourceHandler("swagger-ui.html")
.addResourceLocations("classpath:/META-INF/resources/");
}
//...自定義實現WebMvcConfigurer中的若干預設方法
}
第四步：整合模板引擎
整合Freemarker
第一步：新增必要的依賴
<dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-freemarker</artifactId> </dependency>
第二步：新增必要的設定(重點)
#Freemarker-config # 設定模板前後綴名 #spring.freemarker.prefix= spring.freemarker.suffix=.ftl spring.freemarker.enabled=true # 設定文件型別 spring.freemarker.content-type=text/html spring.freemarker.request-context-attribute=request # 設定ftl檔案路徑 spring.freemarker.template-loader-path=classpath:/templates/ # 設定頁面編碼格式 spring.freemarker.charset=UTF-8 # 設定頁面快取 spring.freemarker.cache=false
第三步：新增必要的配置類
無
第四步：新增控制器和動態頁面
@Controller @RequestMapping("base") @Log4j2 @Api(hidden = true) public class Base { @RequestMapping("/book") @ApiOperation(value = "測試",hidden = true) public String toBookIndexPage(ModelMap model){ log.info("進來啦！！！"); model.put("name","浩哥"); return "/book/index"; } }
resources/book/index.ftl
<#assign base = request.contextPath/> <!DOCTYPE HTML> <HTML> <HEAD> <TITLE>測試首頁</TITLE> <base id="base" href="${base}"> <link rel="stylesheet" href="/webjars/bootstrap/3.3.7-1/css/bootstrap.min.css" /> <script src="/webjars/jquery/3.1.1/jquery.min.js"></script> <script src="/webjars/bootstrap/3.3.7-1/js/bootstrap.min.js"></script> </HEAD> <BODY> ${name} <a class="getBook" onclick="dianji()">點選</a><br/> <button onclick="dianji()">點選</button> </BODY> <SCRIPT> function dianji() { $.ajax({ url: "/account/g/1", type: "GET", success: function (data) { alert(data); } }) } var base = document.getElementById("base").href; // 與後臺互動 _send = function(async,url, value, success, error) { $.ajax({ async : async, url : base + '/' + url, contentType : "application/x-www-form-urlencoded; charset=utf-8", data : value, dataType : 'json', type : 'post', success : function(data) { success(data); }, error : function(data) { error(data); } }); }; </SCRIPT> </HTML>
整合Thymeleaf
第一步：新增必要的jar包
<dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-thymeleaf</artifactId> </dependency>
第二步：新增必要的配置
spring.thymeleaf.cache=false spring.thymeleaf.encoding=UTF-8 spring.thymeleaf.enabled=true spring.thymeleaf.mode=HTML spring.thymeleaf.prefix=classpath:/templates/ spring.thymeleaf.suffix=.html spring.thymeleaf.servlet.content-type=text/html
以上配置中除了第一個之外，其餘皆可不配置，上面的值也是預設值，需要修改的時候再進行配置
第三步：新增必要配置類
無
第四步：新增控制器和動態頁面
@Controller
public class BaseController {
@RequestMapping("index")
public String toIndex(ModelMap model){
model.put("name","首頁啊");
return "index";
}
}
resources/index.html
<!Doctype html>
<html>
<head>
<title>下一頁</title>
</head>
<body>
<h1 th:text="${name}">Hello World</h1>
</body>
</html>
整合WebJar
第一步：新增必要的jar包
<!--匯入bootstrap--> <dependency> <groupId>org.webjars</groupId> <artifactId>bootstrap</artifactId> <version>3.3.7-1</version> </dependency> <!--匯入Jquery--> <dependency> <groupId>org.webjars</groupId> <artifactId>jquery</artifactId> <version>3.1.1</version> </dependency>
第二步：使用WebJar開發前端頁面
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Dalaoyang</title> <link rel="stylesheet" href="/webjars/bootstrap/3.3.7-1/css/bootstrap.min.css" /> <script src="/webjars/jquery/3.1.1/jquery.min.js"></script> <script src="/webjars/bootstrap/3.3.7-1/js/bootstrap.min.js"></script> </head> <body> <div class="container"><br/> <div class="alert alert-success"> <a href="#" class="close" data-dismiss="alert" aria-label="close">×</a> Hello, <strong>Dalaoyang!</strong> </div> </div> </body> </html>