Vue+elementui +Springboot session丢失解决方案
前后端分离项目 由于端口不一致会出现跨域问题 解决跨域以后又会出现前后端sessionID不一致
首先跨域问题 跨域可以在前端配置代理
proxyTable: {
'/': { //可配置
target: 'http://192.168.0.162:8085 ', //后台IP以及端口
changeOrigin: true,
pathRewrite: {
'^/': ''
}
},
},
具体网上很多配置 我主要解决session丢失问题上找了很久才找到真正能解决的方案
后台写过滤器
import java.io.IOException; import javax.servlet.Filter;
import javax.servlet.FilterChain;
import javax.servlet.FilterConfig;
import javax.servlet.ServletException;
import javax.servlet.ServletRequest;
import javax.servlet.ServletResponse;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse; public class MyFilter implements Filter{ @Override
public void init(FilterConfig filterConfig) throws ServletException {
// TODO Auto-generated method stub
}
@Override
public void doFilter(ServletRequest servletRequest, ServletResponse res, FilterChain chain)
throws IOException, ServletException {
HttpServletResponse response = (HttpServletResponse) res;
HttpServletRequest request=(HttpServletRequest)servletRequest;
response.setHeader("Access-Control-Allow-Origin", request.getHeader("Origin"));
response.setHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE");
response.setHeader("Access-Control-Max-Age", "0");
response.setHeader("Access-Control-Allow-Headers", "Origin, No-Cache, X-Requested-With, If-Modified-Since, Pragma, Last-Modified, Cache-Control, Expires, Content-Type, X-E4M-With,userId,token,Access-Control-Allow-Headers");
response.setHeader("Access-Control-Allow-Credentials", "true"); //关键设置
response.setHeader("XDomainRequestAllowed","1");
chain.doFilter(request, response);
}
@Override
public void destroy() {
// TODO Auto-generated method stub
}
}
前端允许携带cookie 就可以了
在main.js中添加axios.defaults.withCredentials = true
Vue+elementui +Springboot session丢失解决方案的更多相关文章
- feign调用接口session丢失解决方案
微服务使用feign相互之间调用时,因为feign默认不传输Header,存在session丢失的问题.例如,使用Feign调用某个远程API,这个远程API需要传递一个鉴权信息,我们可以把cooki ...
- Session丢失——解决方案
先抄下别人的作业(原帖:http://www.cnblogs.com/zhc088/archive/2011/07/24/2115497.html) Session丢失已经是一种习以为常的问题了,在自 ...
- 使用vue+elementUI+springboot创建基础后台增删改查的管理页面--(1)
目前这家公司前端用的是vue框架,由于在之前的公司很少涉及到前端内容,对其的了解也只是会使用js和jquery,所以..慢慢来吧. 在此之前需要先了解vue的大致语法和规则,可先前往官方文档进行学习h ...
- Vue+elementUI+springboot+mybatis demo教程(二)
安装配置node.js安装vue并搭建前台项目前台项目引入elementUI前台项目引入axios本篇主要记录前台项目搭建之前的环境准备,首先要安装node.js(node官网),进行相关配置等. 安 ...
- SpringBoot + Vue + ElementUI 实现后台管理系统模板 -- 后端篇(一): 搭建基本环境、整合 Swagger、MyBatisPlus、JSR303 以及国际化操作
相关 (1) 相关博文地址: SpringBoot + Vue + ElementUI 实现后台管理系统模板 -- 前端篇(一):搭建基本环境:https://www.cnblogs.com/l-y- ...
- ASP.NET 状态服务 及 session丢失问题解决方案总结
ASP.NET2.0系统时,在程序中做删除或创建文件操作时,出现session丢失问题.采用了如下方法:1.asp.net Session的实现:asp.net的Session是基于HttpModul ...
- [转]ASP.NET 状态服务 及 session丢失问题解决方案总结
转自[http://blog.csdn.net/high_mount/archive/2007/05/09/1601854.aspx] 最近在开发一ASP.NET2.0系统时,在程序中做删除或创建文件 ...
- ASP.NET状态服务及session丢失问题解决方案总结
原文:ASP.NET状态服务及session丢失问题解决方案总结[转载] asp.net Session的实现: asp.net的Session是基于HttpModule技术做的,HttpModule ...
- 解决使用elementUI框架el-upload上传组件时session丢失问题
在使用elementui框架上传组件的时候,出现session丢失,后端无法获取到sessionid,导致返回状态为未登陆 查看请求头缺少cookie值 上传组件代码: <el-upload c ...
随机推荐
- 【python 3】 列表方法操作汇总
基础数据类型 : list list主要操作:索引.切片.查询.修改.增加.删除.扩展.统计.排序.获取下标.拷贝…… 1.1 索引 由图: list正向下标从0开始 list反向下标从-1开始 ...
- Demo整合
1.图片上传: https://github.com/842549829/WebUploader 2.百度编辑器: https://github.com/842549829/Ueditor 3.安卓 ...
- 自定义 Cordova插件详解
一.Cordova的基础点 在混合式应用中,我们通过现有的Cordova插件,可以轻松的在 H5 上调用手机native的功能.现有的Cordova插件能满足平时大部分的开发需求,然而,有时候找不到合 ...
- Axure下拉列表的交互事件 + 自定义元件库
下拉列表的交互事件: 场景:当点击第一个下拉列表框的江苏时,第二个列表框会显示江苏省的城市:当点击第一个下拉列表框的北京时,第二个列表框会显示北京市的区 操作:把第二个列表框设置为动态面板,设置为两种 ...
- python高阶函数(Map、Reduce、Filter、lamba)
Map函数 map()函数接收两个参数,一个是函数,一个是序列,map将传入的函数依次作用到序列的每个元素,并把结果作为新的list返回. 代码如下: >>> def f(x): . ...
- 华为的云计算基于openstack #stackalytics#
华为的云计算基于openstack,具体实力可以参考openstack 社区提供的stackalytics http://stackalytics.com/
- Vue-CLI3.0版本配置BootStrap的方法
一.引入jquery bootstrap popper 用 cnpm install jquery bootstrap@3 popper.js --save 用cnpm 来导入 用npm会出 ...
- FPM五:拆解前面的四——OVP做查询和结果
说明:前面的例子是将list和search放到一个Feeder Class里的,这里来做拆解分步说明. 1.创建SEARCH的结构 2.创建RESULT的结构 表类型(不用表类型的话,需要自己在cla ...
- Python----unittest discover()方法与执行顺序
一.Unittest discover()可以根据不同的功能创建不同的测试文件,甚至是不同的测试目录,测试文件中还可以将不同的小功能划分为不同的测试类,在类下编写测试用例,让整体结构更加清晰一般是通过 ...
- minecraft初探
1.在确保客户端和服务器的版本一致的情况下,如果登录出现客户端直接关闭,查看服务器端信息是提示id为空,请注意是否设置了: online-mode=false