原創(chuàng)文章,轉載請標注出處:《SpringBoot基礎系列-整合SpringMVC》
步驟
第一步:添加必要依賴
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
</dependency>
第二步:添加必要的配置
無
第三步:添加必要的配置類
SpringBoot整合SpringMVC沒有必需的配置類蒲障,只有在想要自定義的時候添加一些實現(xiàn)了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/");
}
//...自定義實現(xiàn)WebMvcConfigurer中的若干默認方法
}
第四步:整合模板引擎
整合Freemarker
1. 添加必要的依賴
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-freemarker</artifactId>
</dependency>
2. 添加必要的設置(重點)
#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
3. 添加必要的配置類
無
4. 添加控制器和動態(tài)頁面
@Controller
@RequestMapping("base")
@Log4j2
@Api(hidden = true)
public class Base {
@RequestMapping("/book")
@ApiOperation(value = "測試",hidden = true)
public String toBookIndexPage(ModelMap model){
log.info("進來啦g允堋M扪适揉!");
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
1. 添加必要的jar包
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
2. 添加必要的配置
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
以上配置中除了第一個之外黔牵,其余皆可不配置聪轿,上面的值也是默認值,需要修改的時候再進行配置猾浦。
3. 添加必要配置類
無
4. 添加控制器和動態(tài)頁面
@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
1. 添加必要的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>
2. 使用WebJar開發(fā)前端頁面
<!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>