Ajax+SpringBoot+Thymeleaf使用中遇到的跳转页面问题_thymeleaf使用ajax进行页面跳转

前言：这周在使用 Ajax+Thymeleaf 时遇到一个问题，折腾了我很久，在此记录一下

Ajax+SpringBoot+Thymeleaf使用中遇到的跳转页面问题

问题描述

我的目的：通过 Ajax 获取数据，并通过 Model 渲染 View ，实现跳转页面并渲染数据
但是… Ajax 获取到数据并发送回服务器了，但是却无法跳转页面。

这个问题困扰了我一段时间，主要是当时只是以为页面数据没有刷新，并没有发现页面根本就没跳转…

HTML

JS(Ajax)

Controller 层

解决方法

我在意识到这个是页面无法跳转问题之后就试着看看重定向能不能使页面跳转，结果还是不行。

最后还行求助于万能的百度，发现页面无法跳转的原因竟然是：
ajax 只能实现局部刷新，无法执行整体的页面跳转并携带数据

额… Ajax 只能局部刷新这个概念我之前是知道的，这个甚至可以说是它的主要优点之一，因为不用整体再刷新页面…

好吧，原因是找出来了，但为什么重定向也失效了呢？

我又测试了一下发现，在浏览器端按F12查看网络请求是否成功，它响应了302状态码，响应302状态码就表示后端重定向起了作用，但是由于是ajax请求所以页面还是原来的页面。

还是那个原因：
因为ajax请求是异步请求，局部刷新的方式，所以使用重定向也无法跳转到其他的页面，如果想要跳转页面则需要在前端利用通过location.href来跳转。

解决方法：把 Ajax 请求改成了 form 表单，实现页面跳转

PS：也可以到我的个人博客查看更多内容
个人博客地址：小关同学的博客