在 Spring MVC 中部署路由为history模式的vue项目

为了处理 Vue.js 的 History 模式,需要在 Spring MVC 中配置一个控制器来转发所有的非 API 请求到 index.html。这样,前端路由可以接管 URL 并正确显示 Vue.js 组件。

创建一个控制器(例如 ForwardingController)来处理所有的前端路由:

java 复制代码
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;

@Controller
public class ForwardingController {

    @GetMapping("/**/{path:[^\\.]*}")
    public String forward() {
        // 将所有匹配的请求转发到 /index.html
        return "forward:/index.html";
    }
}

在这个控制器中,/**/{path:[^\.]*} 是一个路径匹配模式,它匹配所有的路径(不包含点 ., 因为点通常用于文件扩展名)。这确保了 Vue.js 的 History 模式可以正确处理路由。

相关推荐
qq_364371723 分钟前
Vue 内置组件 keep-alive 中 LRU 缓存淘汰策略和实现
前端·vue.js·缓存
你挚爱的强哥5 小时前
✅✅✅【Vue.js】sd.js基于jQuery Ajax最新原生完整版for凯哥API版本
javascript·vue.js·jquery
susu10830189116 小时前
vue3中父div设置display flex,2个子div重叠
前端·javascript·vue.js
天天进步20158 小时前
Vue+Springboot用Websocket实现协同编辑
vue.js·spring boot·websocket
草莓base9 小时前
【手写一个spring】spring源码的简单实现--bean对象的创建
java·spring·rpc
疯狂的沙粒9 小时前
如何在Vue项目中应用TypeScript?应该注意那些点?
前端·vue.js·typescript
小镇程序员9 小时前
vue2 src_Todolist全局总线事件版本
前端·javascript·vue.js
乌啼霜满天2499 小时前
Spring 与 Spring MVC 与 Spring Boot三者之间的区别与联系
java·spring boot·spring·mvc
Elaine2023919 小时前
零碎04 MybatisPlus自定义模版生成代码
java·spring·mybatis
想自律的露西西★10 小时前
用el-scrollbar实现滚动条,拖动滚动条可以滚动,但是通过鼠标滑轮却无效
前端·javascript·css·vue.js·elementui·前端框架·html5