vue打包后放到springboot后台项目中访问body为空

最新推荐文章于 2024-08-13 20:45:00 发布
最新推荐文章于 2024-08-13 20:45:00 发布
阅读量4.1k 收藏 3
点赞数 1
分类专栏： spring 文章标签： 开发问题
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/dandandeteng/article/details/88313182
版权
本文记录了在SpringBoot项目中部署Vue打包应用时遇到的一个问题，即访问页面时body内容为空。经过排查，问题出在后台的拦截器配置上。虽然已设定三个接口不受拦截，但实际运行时所有请求都被拦截并返回false。最终发现一个不起眼的注解导致了错误，此情况在Spring Boot和Vue整合时并不常见，通常只需将Vue打包后的文件放入resource/static目录即可正常运行。
摘要由CSDN通过智能技术生成

1.现象

确认了前台打包路径和打包后的文件防止路径没有问题

调试找之后发现，后台中拦截器部分出了问题，看后台拦截器的配置

这三个接口不拦截，但是启动后输入localhost:8086/,拦截器中还是被拦截了，返回了false

最后发现一个不起眼的注解让我搞了半天，需要记录下脑子进坑的时刻

注：spring boot和vue整合一般不需要做特别的配置，只需要将vue项目正常打包放入resource/static下即可

IT咸鱼圈
关注
专栏目录
spring boot+vue项目运行是空白
qq_42212132的博客
08-17 1246
报错如下，按平常正常的步骤来，先运行后端，再启动前端，报错如下： 尝试1.在产生这个错误前，我因为项目80端口总是被占用，自己改了端口为84，可能是这个错？？？？ 操作：刚刚去launch.json文件下修改8080为8084，重新启动前端 前端跑了很久，最后出来还是8080，在浏览器运行仍然是空白，但是报错变了 然后我将端口改回了80 运行后端，报错如下： 尝试2.因为80端口被占用，那我去关闭所有的80端口？？ https://blog.csdn.net/qu...
springboot+vue之处理json 数据
weixin_43213137的博客
02-09 2704
一、前言：springboot+vue 项目，项目用到了spring security，前端登陆时，需要传json给后端，但是spring 默认是不接受json的。 处理方式，可以在后端配置，但是我这里采用前端处理的方式。 建立一个前端工具文件，里面来处理请求和数据发送 我这里文件 apj.js let base = ''; //定义前缀 方便信息更改 export const postKeyV...
Vue项目部署在Spring Boot出现页面空白问题的解决方案
java_augur的专栏
11-24 9722
网上流行的解决方案是将assetsPublicPath: '/'改成'./'，下面说一下这个解决方案的弊端： 通常页面空白的问题出现大多数是由于Spring Boot端配置了server.servlet.context-path，上下文改变了css, js等文件的访问路径，文件无法加载导致index.html显示空白。'/'改成'./'是将绝对路径变为相对路径，可以动态适应Spring Boot...
Vue项目部署到SpringBoot项目的方法
最新发布
IT利刃出鞘的博客
08-13 610
本文介绍如何将Vue项目部署到SpringBoot项目。
关于webpack打包vue项目后的页面body为空的问题
ShiYadong的专栏
03-19 3017
build之后,终端里会有个提示: Tip: built files are meant to be served over an HTTP server. Opening index.html over file:// won't work.npm run dev是开发环境, npm run build是生产环境, 在开发环境完成代码和测试, 之后用生产环境生成代码,npm run bui...
基于springboot+vue的前后端分离后项目部署方案
CSDN_KONGlX的博客
07-06 2941
.markdown-body { line-height: 1.75; font-weight: 400; font-size: 16px; overflow-x: hidden; color: rgba(51, 51, 51, 1) } .markdown-body h1, .markdown-body h2, .markdown-body h3, .markdown-body h4, .ma...
基于SpringBoot+Vue的前后端分离练习项目
xmp
05-14 4583
这是一款基于SpringBoot+Vue的前后端分离的项目，麻雀虽小，五脏俱全，值得拥有！
springboot+vue练手级项目，真实的在线博客系统
m0_67403240的博客
07-29 1万+
1=1=null">=null">
SpringBoot与Vue前后端数据交互的实现问题
xiongyuhui520的博客
07-31 1936
题主这里使用的是vue的vue.config.js配置文件来实行跨域问题的解决，详细配置文件如下: 这里放上代码:总目录下创建 vue.config.js这一文件,代码如下: // vue.config.js 配置说明 //官方vue.config.js 参考文档 https://cli.vuejs.org/zh/config/#css-loaderoptions // 这里只列一部分，具体配置参考文档 module.exports = { // 部署生产环境和...
[Vue] 4. vue4打包并发布到springboot里面
animalcoder
03-16 1327
Vue-cli版本:4.0 1.配置vue.config.js const path = require('path') module.exports = { // 基本路径 整个文件夹在哪 //publicPath: process.env.NODE_ENV === 'production' ? '/static/' : './', publicPath: './', ...
VUE打包后不显示问题
qiankui的博客
06-09 3450
在运行 npm run bulid后，打开dist目录下打包好的文件，不显示仍和数据 页面打开一片空白，原因是打包时，路径不对 解决办法： 在根目录新建 vue.config.js ，这个文件是vue规定好的，专门用来做bulid里面的配置 module.exports={ baseUrl: process.env.NODE_ENV=='production'?'./':'/...
vue打包之后出现空白页的原因以及解决方式
热门推荐
温情
04-02 3万+
路由模式 history 新建项目什么都不动，路由模式：history, 直接npm run build打包 打包之后，直接打开dist文件里面的ndex.html可以看到页面是空白的，控制台是这样的。 再看看网页源码, 对比dist文件夹结构可以看到资源路径的引入是错误的，应该用'./'而不是'/' 那怎么修改打包之后的路径呢？查看vue-cli官网配置参考中的publicPath 我们只需要在和package.json同级的地方新增一个vue.config.js文
SpringBoot+Vue打包为war，以及在Tomcat部署后，页面访问不到静态资源
weixin_57665275的博客
04-14 3077
SpringBoot+Vue打包为war，以及在Tomcat部署后，页面访问不到静态资源
springboot加vue打包后运行访问不到vue页面问题
又菜又爱玩的博客
04-18 2179
找了很多博客都没有解决，最后切换了个项目再切换回来，突然就可以访问了，于是将vue打包文件放进去后进行maven刷新，发现问题解决。 刷新后
使用springboot实现jsonp|jsonp的实现|JSONP的实现使用springboot
cyberzhaohy的专栏
12-03 1574
使用springboot实现jsonp|jsonp的实现|JSONP的实现使用springboot
vue框架开发出现页面空白、白屏的解决方法总汇
kjnsfijglqj的博客
11-22 8871
转载自http://www.fly63.com/article/detial/287 1.npm run build打包页面空白 我们会发现页面head中引用的js和css文件是出现了路径错误，这里修改如下： 解决位置：config/index.js文件：把assetsPublicPath: '/'改为assetsPublicPath: './' build: { assetsP...
vue打包后放到springboot
04-05
1. 在Vue项目中运行 `npm run build` 命令，该命令会将Vue项目打包成静态文件。 2. 将打包后的文件夹（dist文件夹）复制到Spring Boot项目的src/main/resources/static目录下。 3. 在Spring Boot项目中创建一个...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值