当前位置: 移动技术网 > IT编程>开发语言>JavaScript > 解决前后端分离项目集成shiro后,上传文件需要登录问题

解决前后端分离项目集成shiro后,上传文件需要登录问题

2020年07月23日  | 移动技术网IT编程  | 我要评论

解决前后端分离项目集成shiro后,上传文件需要登录问题

原因:因为前后端分离项目不能通过cookie获取session对象,当你已经登录过后发送上传文件的请求的时候shiro检测到你的请求头中没有当前登录过后的sessionid,所以会判断出当前是未登录状态

解决:

1、在main.js中添加请求头

//ajax
import axios from 'axios'
axios.defaults.baseURL="http://localhost:80";
Vue.prototype.$http=axios;

axios.interceptors.request.use(config => {
    //从前端项目的session存储中获取sessionid
    let sessionid = sessionStorage.getItem("sessionid");
    //添加请求头
    config.headers.SESSIONID = sessionid;
    return config;
},error => {
    return Promise.reject(error);
});

2、在el-upload标签上添加 :headers="headers"属性

<el-upload
           class="upload-demo"
           action="http://localhost:80/uploadFile"
           :on-remove="handleRemove"
           :multiple="false"
           :limit="1"
           :headers="headers"
           name="annexFile"
           :on-success="uploadSuccess"
           :file-list="fileList">
    <el-button size="small" type="primary">点击上传</el-button>
</el-upload>
 //设置请求头
headers: {
//获取已经登录后的请求头信息
'SESSIONID': sessionStorage.getItem("sessionid")
}

本文地址:https://blog.csdn.net/ld12g/article/details/107497892

如对本文有疑问, 点击进行留言回复!!

相关文章:

验证码:
移动技术网