SpringBoot跳转页面详解+thymeleaf

初次做SpringBoot,要解决页面跳转的问题,这个问题我弄了大半天,弄好后,其实也不算个事,写出来给大家提个醒!其实不要使用spring boot的@RestController注解,直接使用spring原来的注解@Controller就可以了。示例如下:

@Controller

public class ActionController {

    @RequestMapping(value = "/action",method = RequestMethod.GET)

    public String index(){

        return "login";

    }

}

如果你的项目如什么都没有配,那么你想跳到login.html时,语句必须是  return "login.html"  ,否则它会报错 。因为找不到login文件。

        为什么呢?因为@RestController注解,相当于@Controller+@ResponseBody两个注解的结合, @Responsebody后,返回结果直接写入HTTP response body中,不会被解析为跳转路径,所以你总是看到是打印字符串的效果,不是跳转效果。

=========================================================

        请看更详细的解答:SpringBoot里面没有我们之前常规web开发的WebContent(WebApp),它只有src目录,在src/main/resources下面有两个文件夹,[static]和[templates],springboot默认static中放静态页面,而templates中放动态页面,见下图:

静态页面:

        静态页面可以直接访问。这里我们直接在static放一个hello.html,然后直接输入http://localhost:8080/hello.html便能成功访问(好像可以新建一个public文件夹,也可以放静态文件)。

        也可以通过controller跳转:

@Controller

public class HelloController {

    @RequestMapping("/Hi")

    public String sayHello() {

        return "hello.html";

    }

}

        然后输入http://localhost:8080/Hi就可以成功访问 

动态页面:

        动态页面需要先请求服务器,访问后台应用程序,然后再转向到页面,比如访问JSP。spring boot建议不要使用JSP,默认使用Thymeleaf来做动态页面。

要在pom中要添加Thymeleaf组件

        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-thymeleaf</artifactId>
        </dependency>

但你加上了上面的thymeleaf后,你必须重启工程,即使是你配置了热启动后,也要重启工程,才可以看到效果 。

    我们先在tempates文件夹中也新建一个hello.html但内容不同,然后先试一下直接访问该页面。输入http://localhost:8080/hello.html:

结果显然访问的是静态问价夹里面的那个hello.html

然后我们现在再试一下用controller:

似乎无法访问到hello.html了。。。这是因为:静态页面的return默认是跳转到/static/index.html,当在pom.xml中引入了thymeleaf组件,动态跳转会覆盖默认的静态跳转,默认就会跳转到/templates/index.html,注意看两者return代码也有区别,动态有或没有html后缀都可以。

也就是我们要这样改controller:

@Controller

public class HelloController {

@RequestMapping("/Hi")

    public String sayHello() {

        return "hello";//在没有配置的情况下,return "hello”; 或者return "hello"都可以,它们都会到templates/index.html去。

    }  

}

然后就可以成功跳转了

然后我们看看返回一点数据在前端利用Thyemleaf来拿:

@Controller

public class HelloController {

 

    @RequestMapping("/Hi")

    public ModelAndView sayHello() {

        ModelAndView modelAndView = new ModelAndView();

        modelAndView.setViewName("hello");

        modelAndView.addObject("key", 12345);

        //System.out.println("test");

        return modelAndView;

    }

   

}

---------------------

Templates/hello.html

---------------------

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8"/>

<title>Insert title here</title>

 

</head>

<body>

<h1>this is the hello.html in templates</h1>

<span th:text="${key}"></span> 

</body>

</html>

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值