springboot與thymeleaf搭建項目
一、springboot跳轉html的項目搭建
參考:
springboot項目創建教程 https://blog.csdn.net/q18771811872/article/details/88126835
springboot2.0 跳轉html教程 https://blog.csdn.net/q18771811872/article/details/88312862
springboot2.0 跳轉jsp教程 https://blog.csdn.net/q18771811872/article/details/88342298
————————————————
版權聲明:本文為CSDN博主「築基始,仙魔終」的原創文章,遵循CC 4.0 BY-SA版權協議,轉載請附上原文出處鏈接及本聲明。
原文鏈接:https://blog.csdn.net/q18771811872/article/details/88343672
建議:在新建項目的時候,直接選擇thymeleaf,就可以不用下邊這些配置和添加依賴等的操作的了。
1、使用Spring initializer初始化項目
2、添加pom.xml文件依賴
① web的starter
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
</dependency>
② thymeleaf
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
③ 此時thymeleaf無法正常訪問到頁面,需要指定版本
<thymeleaf.version>3.0.11.RELEASE</thymeleaf.version>
<!-- 布局功能的支持程序 thymeleaf3主程序 layout2以上版本 -->
<!-- thymeleaf2 layout1-->
<thymeleaf-layout-dialect.version>2.1.1</thymeleaf-layout-dialect.version>
在properties中添加如上:
3、添加application.xml配置thymeleaf,實現頁面跳轉html
application.xml
server.port=8081
# ====thymeleaf相關====
#<!-- 關閉thymeleaf緩存 開發時使用 否則沒有實時畫面-->
spring.thymeleaf.cache=false
## 檢查模板是否存在,然后再呈現
spring.thymeleaf.check-template-location=true
#Content-Type值
spring.thymeleaf.servlet.content-type=text/html
#啟用MVC Thymeleaf視圖分辨率
spring.thymeleaf.enabled=true
# 應該從解決方案中排除的視圖名稱的逗號分隔列表
##spring.thymeleaf.excluded-view-names=
#模板編碼
spring.thymeleaf.mode=LEGACYHTML5
# 在構建URL時預先查看名稱的前綴
spring.thymeleaf.prefix=classpath:/templates/
# 構建URL時附加查看名稱的后綴.
spring.thymeleaf.suffix=.html
# 鏈中模板解析器的順序
#spring.thymeleaf.template-resolver-order= o
# 可以解析的視圖名稱的逗號分隔列表
#spring.thymeleaf.view-names=
#thymeleaf end
可以參照ThymeleafProperties類進行配置文件的配置(不配的話會默認配置為如下)
4、添加Controller
在main下創建controller包,寫controller控制類
package com.ims.xiaokeai.controller;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
/**
* @author jiyongjia
* @create 2020/5/20 - 13:08
* @descp:
*/
@Controller
@RequestMapping("/xiaokeai2")
public class MainController {
@RequestMapping("/index")
public String get1(){
return "my520/index";
}
@RequestMapping("/show")
public String show(){
return "my520/show";
}
@RequestMapping("/result")
public String result(){
return "my520/result";
}
@RequestMapping("/biubiu")
public String biubiu(){
return "biubiu";
}
@RequestMapping("/qinqin")
public String qinqin(){
return "qinqin";
}
}
5、在resources文件夾下的templates目錄,新建html頁面
該處用於存放HTML等模板文件,在這新增hello.html,添加如下代碼。
切記:使用Thymeleaf模板引擎時,必須在html文件上方添加該行代碼使用支持Thymeleaf。不然引起識別不了html模板。
<html lang="en" xmlns:th="http://www.thymeleaf.org">
使用外部的css文件
在static下創建css目錄結構
在html中引用這個css
6、測試
此時,啟動項目,請求url映射地址,就可以完成請求啦~
訪問:http://xx.xx.xx.65:8081/xiaokeai2/index
結果:
7、部署存在的問題
二、實現Springboot整合SpringMvc跳轉jsp(無html)
問題提出
參考:
springboot項目創建教程 https://blog.csdn.net/q18771811872/article/details/88126835
springboot2.0 跳轉html教程 https://blog.csdn.net/q18771811872/article/details/88312862
springboot2.0 跳轉jsp教程 https://blog.csdn.net/q18771811872/article/details/88342298
————————————————
版權聲明:本文為CSDN博主「築基始,仙魔終」的原創文章,遵循CC 4.0 BY-SA版權協議,轉載請附上原文出處鏈接及本聲明。
原文鏈接:https://blog.csdn.net/q18771811872/article/details/88343672
1、使用Spring initializer初始化項目
2、需要導入的jar包
記得去掉thymeleaf依賴后,添加如下,再訪問jsp才能成功
<dependency>
<groupId>org.apache.tomcat.embed</groupId>
<artifactId>tomcat-embed-jasper</artifactId>
<scope>provided</scope>
</dependency>
<dependency>
<groupId>javax.servlet</groupId>
<artifactId>jstl</artifactId>
</dependency>
3、完善項目的結構
默認的springboot項目是沒有webapp/WEB-INF的,我們需要建立出這個。
方法:
步驟1:新建如下的目錄結構信息
步驟2:添加webapp為web文件夾
(復制webapp的路徑到此處即可)
成功后顯示有綠點在webapp上。
4、添加配置
spring.mvc.view.prefix=/WEB-INF/jsp/
spring.mvc.view.suffix=.jsp
此時,配置文件中就不要如下
#spring.thymeleaf.prefix=classpath:/templates/
# 構建URL時附加查看名稱的后綴.
#spring.thymeleaf.suffix=.html
5、controller
@Controller
public class HelloController {
//index.jsp
@RequestMapping("test03")
public String test03(){
return "index";
}
}
6、測試輸出:
三、springboot同時跳轉jsp和html
1、方案1:getRequestDispatcher
1、pom.xml文件同時放入thymeleaf 架包和jsp支持后, springboot的return模版會默認跳轉到html ,那怕是你並沒有配置thymeleaf的屬性。
解決方案, 使用getRequestDispatcher方法來跳轉到jsp頁面, 就同時支持html和jsp了 request.getRequestDispatcher("/WEB-INF/views/testJsp.jsp").forward(request, response);
步驟1:依賴
<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd">
<modelVersion>4.0.0</modelVersion>
<parent>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-parent</artifactId>
<version>2.3.0.RELEASE</version>
<relativePath/> <!-- lookup parent from repository -->
</parent>
<groupId>com.ims</groupId>
<artifactId>springbootandmvc</artifactId>
<version>0.0.1-SNAPSHOT</version>
<name>springbootandmvc</name>
<description>Demo project for Spring Boot</description>
<properties>
<java.version>1.8</java.version>
</properties>
<dependencies>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
</dependency>
<dependency>
<groupId>org.apache.tomcat.embed</groupId>
<artifactId>tomcat-embed-jasper</artifactId>
<scope>provided</scope>
</dependency>
<dependency>
<groupId>javax.servlet</groupId>
<artifactId>jstl</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-test</artifactId>
<scope>test</scope>
<exclusions>
<exclusion>
<groupId>org.junit.vintage</groupId>
<artifactId>junit-vintage-engine</artifactId>
</exclusion>
</exclusions>
</dependency>
</dependencies>
<build>
<plugins>
<plugin>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-maven-plugin</artifactId>
</plugin>
</plugins>
</build>
</project>
步驟2:配置文件
我們通過搭建好thymeleaf引擎后,配置文件如下:
步驟3:controller層轉發到jsp
package com.ims.springbootandmvc.controller;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
/**
* @author jiyongjia
* @create 2020/5/20 - 23:32
* @descp:
*/
@Controller
public class HelloController {
//跳轉html
@RequestMapping("test01")
public String test01(){
return "hello";
}
//跳轉html加css
@RequestMapping("test02")
public String test02(){
return "hello2";
}
//跳轉jsp
@RequestMapping("test03")
public String test03(){
return "index";
}
//跳轉jsp和html
@RequestMapping("test04")
public void test04(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
request.getRequestDispatcher("/WEB-INF/jsp/index.jsp").forward(request,response);
}
}
步驟4:測試
步驟5:使用css的兩種方式
方式1:jsp和html使用統一的靜態css文件路徑,無法區分開jsp的css和html的css
我們需要在jsp頁面引入css如下:
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/index.css">
方式2:使用絕對路徑的方式把jsp的css都放在webapp/static/css下
此時,我們關於html的模板和靜態文件都在resources下,
關於jsp的都在webapp下,如下:
jsp中使用的css如下。
<link rel="stylesheet" type="text/css" href="../../../static/css/index2.css">
參考方法2:
2、另外 使用getRequestDispatcher跳轉到html頁面的時候,thymeleaf 模版接收參數可能會出現問題。
解決方案1:html放棄使用thymeleaf 模版,然后在頁面主動請求接口數據(AJAX POST等)
解決方案2:html繼續使用thymeleaf 模版,用return模版 返回來跳轉頁面