• springboot与thymeleaf搭建项目，同时访问html页面和jsp

    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初始化项目

    image-20200520214420215

    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中添加如上：

    image-20200520214658063

    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类进行配置文件的配置(不配的话会默认配置为如下)

    image-20200520223310179

    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，添加如下代码。

    image-20200520224240300

    切记：使用Thymeleaf模板引擎时，必须在html文件上方添加该行代码使用支持Thymeleaf。不然引起识别不了html模板。

    <html lang="en" xmlns:th="http://www.thymeleaf.org">

    image-20200520231717524

    使用外部的css文件

    在static下创建css目录结构

    image-20200520234613966

    在html中引用这个css

    image-20200520234640455

    6、测试

    此时，启动项目，请求url映射地址，就可以完成请求啦~

    访问：http://xx.xx.xx.65:8081/xiaokeai2/index

    结果：

    image-20200520224337935

    7、部署存在的问题

    image-20200520230520499

    二、实现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初始化项目

    image-20200520214420215

    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：新建如下的目录结构信息

    image-20200521100637130

    步骤2：添加webapp为web文件夹

    （复制webapp的路径到此处即可）

    image-20200521100557601

    成功后显示有绿点在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、测试输出：

    image-20200521102030634

    三、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引擎后，配置文件如下：

    image-20200521103307699

    步骤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：测试

    image-20200521103749153

    步骤5：使用css的两种方式

    方式1：jsp和html使用统一的静态css文件路径，无法区分开jsp的css和html的css

    image-20200521104424478

    我们需要在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下，如下：

    image-20200521105225900

    jsp中使用的css如下。

    <link rel="stylesheet" type="text/css" href="../../../static/css/index2.css">

    image-20200521105013403

    参考方法2：

    2、另外 使用getRequestDispatcher跳转到html页面的时候，thymeleaf 模版接收参数可能会出现问题。

    解决方案1：html放弃使用thymeleaf 模版，然后在页面主动请求接口数据(AJAX POST等)

    解决方案2：html继续使用thymeleaf 模版，用return模版 返回来跳转页面
  • 相关阅读:
    eval解析的函数传参 object array
    whistle证书过期或不信任
    isa hasa的区别、及理解
    JVM工作原理和特点
    Cookie跨域操作
    关闭当前窗口js
    css遮罩层
    js 获得两个数组的重复元素
    主页变灰
    js 格式化日期
  • 原文地址：https://www.cnblogs.com/jiyongjia/p/12929386.html
Copyright © 2020-2023  润新知