解决vue项目axios每次请求session不一致的问题


Posted in Javascript onOctober 24, 2020

1、vue开发后台管理项目,登录后,请求数据每次session都不一致,后台返回未登录,处理方法打开main.js设置:

// The Vue build version to load with the `import` command
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
import Vue from 'vue'
import App from './App'
import router from './router'
require('es6-promise').polyfill()
import MintUI from 'mint-ui'
import 'mint-ui/lib/style.css'
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
import store from './store'
import axios from 'axios' // 1、在这里引入axios 
 
axios.interceptors.response.use(function(res) {
 var res = res.data;
 if(res.status === 403 ) {
 router.push('/')
 return res;
 }
 return res;
}, function(error) {
 return Promise.reject(error);
});
axios.defaults.withCredentials = true; //意思是携带cookie信息,保持session的一致性
Vue.prototype.$axios = axios
Vue.prototype.stringify = require('qs').stringify; 
 
Vue.use(MintUI)
Vue.use(ElementUI);
Vue.config.productionTip = false
 
/* eslint-disable no-new */
new Vue({
 el: '#app',
 router,
 store,
 components: { App },
 template: '<App/>'
})

withCredentials为false意思是不携带cookie信息,为保持session的一致性需设置为true;

2、为解决跨域,需要代理

解决vue项目axios每次请求session不一致的问题

3、数据请求

解决vue项目axios每次请求session不一致的问题

补充知识:解决跨域造成Vue-element每次请求sessionID不同问题

vue-element作为前端开发框架, 前后端分离项目ajax跨域, 每次http请求后sessionId均会发生变化,导致获取session失败,

只需要在文件vue-element-admin-master-1\src\utils\request.js中添加如下代码即可:

withCredentials: true,

crossDomain: true

整个axios请求为:

const service = axios.create({
 baseURL: process.env.BASE_API, // api的base_url
 timeout: 5000, // request timeout
 withCredentials: true,
 crossDomain: true
})

以上这篇解决vue项目axios每次请求session不一致的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jquery数组过滤筛选方法grep()简介
Jun 06 Javascript
上传图片预览JS脚本 Input file图片预览的实现示例
Oct 23 Javascript
javascript数组去重的方法汇总
Apr 14 Javascript
浅谈Jquery核心函数
Jun 18 Javascript
jquery实现鼠标滑过后动态图片提示效果实例
Aug 10 Javascript
javascript实现简单加载随机色方块
Dec 25 Javascript
React diff算法的实现示例
Apr 20 Javascript
JavaScript原型对象、构造函数和实例对象功能与用法详解
Aug 04 Javascript
JavaScript常用数组操作方法,包含ES6方法
May 10 Javascript
webpack3.0升级4.0的方法步骤
Apr 02 Javascript
vue中keep-alive内置组件缓存的实例代码
Apr 16 Javascript
浅谈Vuex的this.$store.commit和在Vue项目中引用公共方法
Jul 24 Javascript
解决vue中使用less/sass及使用中遇到无效的问题
Oct 24 #Javascript
vue中是怎样监听数组变化的
Oct 24 #Javascript
JSON stringify方法原理及实例解析
Oct 23 #Javascript
vue中使用腾讯云Im的示例
Oct 23 #Javascript
vue中使用router全局守卫实现页面拦截的示例
Oct 23 #Javascript
vue使用video插件vue-video-player详解
Oct 23 #Javascript
vue-video-player视频播放器使用配置详解
Oct 23 #Javascript
You might like
PHP 数字左侧自动补0
2008/03/31 PHP
PHP生成UTF8文件的方法
2010/05/15 PHP
php 转换字符串编码 iconv与mb_convert_encoding的区别说明
2011/11/10 PHP
Laravel 5 学习笔记
2015/03/06 PHP
PHP输出图像imagegif、imagejpeg与imagepng函数用法分析
2016/11/14 PHP
解决IE下select标签innerHTML插入option的BUG(兼容IE,FF,Opera,Chrome,Safari)
2010/05/13 Javascript
关于firefox的ElementTraversal 接口 使用说明
2010/11/11 Javascript
jQuery列表拖动排列具体实现
2013/11/04 Javascript
jQuery$命名冲突怎么办如何解决
2014/01/16 Javascript
Javascript非构造函数的继承
2015/04/27 Javascript
Hammer.js+轮播原理实现简洁的滑屏功能
2016/02/02 Javascript
基于Bootstrap+jQuery.validate实现表单验证
2016/05/30 Javascript
Json对象和字符串互相转换json数据拼接和JSON使用方式详细介绍(小结)
2016/10/25 Javascript
Jquery删除css属性的简单方法
2016/12/04 Javascript
div实现自适应高度的textarea实现angular双向绑定
2017/01/08 Javascript
JavaScript 完成注册页面表单校验的实例
2017/08/19 Javascript
Vue项目分环境打包的实现步骤
2018/04/02 Javascript
vue权限路由实现的方法示例总结
2018/07/29 Javascript
vue实现与安卓、IOS交互的方法
2018/11/02 Javascript
jquery插件懒加载的示例
2020/10/24 jQuery
python 判断自定义对象类型
2009/03/21 Python
ubuntu系统下使用pm2设置nodejs开机自启动的方法
2018/05/12 NodeJs
Python获取数据库数据并保存在excel表格中的方法
2019/06/12 Python
python3.4+pycharm 环境安装及使用方法
2019/06/13 Python
分享一个H5原生form表单的checkbox特效代码
2018/02/26 HTML / CSS
Html5与App的通讯方式详解
2019/10/24 HTML / CSS
英国足球店:UK Soccer Shop
2017/11/19 全球购物
专业幼师实习生自我鉴定范文
2013/12/08 职场文书
农场厂长岗位职责
2013/12/28 职场文书
企业演讲比赛主持词
2014/03/18 职场文书
工作评语大全
2014/04/26 职场文书
县政府领导班子“四风”方面突出问题整改措施
2014/09/23 职场文书
2014党的群众路线教育实践活动总结报告
2014/10/31 职场文书
学校国庆节活动总结
2015/03/23 职场文书
2016年小学教师政治学习心得体会
2016/01/23 职场文书
Springboot如何使用logback实现多环境配置?
2021/06/16 Java/Android