精华内容
下载资源
问答
  • session vue
    千次阅读
    2019-08-26 20:30:08

    转载自https://blog.csdn.net/qq_26566331/article/details/72478923

    更多相关内容
  • vuesession的存取用法

    千次阅读 2020-03-21 21:33:02
    存的方法 sessionStorage.setItem(“username(起一个名字为了取得时候用)”, this.value(这个是你要存进去的数据)); 取的方法 你可以定义一个变量然后去取他 this.(你取名的变量) = sessionStorage.getItem(...

    存的方法

    sessionStorage.setItem(“username(起一个名字为了取得时候用)”, this.value(这个是你要存进去的数据));

    取的方法

    你可以定义一个变量然后去取他
    this.(你取名的变量) = sessionStorage.getItem(“username” (你当时存的时候起的名字));

    这样只要是不去关闭页面他就一直存在

    展开全文
  • vuesession存取数据

    千次阅读 2021-11-19 19:51:01
    //将js数据转换为json格式数据存放到session sessionStorage.setItem("username", JSON.stringify(data)); 2.取数据 var user = sessionStorage.getItem("username"); if (user != null) { // 将JSON格式的...

    1.存放数据

    //将js对象转换为json对象存放到session
    sessionStorage.setItem("user", JSON.stringify(data));

    2.取出数据

     let user = sessionStorage.getItem("user");
     if (user != null) {
          // 将JSON格式的对象解析为js对象
          this.currentUser= JSON.parse(user);
      }

    !!注意存放数据的名字要和取数据的名字一致 

    展开全文
  • springboot+vue实现细粒度的session处理 编写逻辑 1.使用自定义的过滤器去实现servlet的Filter接口,重写doFilter方法 2. 在springboot的入口类上使用@ServletComponentScan注解引入自定义的过滤器 3. 在实现...

    springboot+vue实现细粒度的session处理

    编写逻辑

    1.使用自定义的过滤器去实现servlet的Filter接口,重写doFilter方法
    2. 在springboot的入口类上使用@ServletComponentScan注解引入自定义的过滤器
    3. 在实现doFilter方法的时候,如果session没有过期,则放行,否则则返回session过期的提示信息给前端
    4. 前端接收到session过期(一般都会在请求响应时做统一处理),则提示用户session过期,然后重定向到登录页面即可;

    代码示例

    1. 以下代码参考了部分网友的写法:spring boot使用过滤器(以session校验为例)

    2. 后端代码:

      A.自定义的Filter:

    import com.alibaba.fastjson.JSONObject;
    import com.itsource.base.common.SdmConst;
    
    import javax.servlet.*;
    import javax.servlet.annotation.WebFilter;
    import javax.servlet.http.HttpServletRequest;
    import javax.servlet.http.HttpServletResponse;
    import javax.servlet.http.HttpSession;
    import java.io.IOException;
    import java.io.PrintWriter;
    
    @WebFilter(filterName = "sessionFilter",urlPatterns = {"/*"})
    public class SessionFilter implements Filter {
    
        //标示符:表示当前用户未登录(可根据自己项目需要改为json样式)
        String EXPIRE_MSG = "{\"data\":{\"code\": \"100003\"}}";
    
        //不需要登录就可以访问的路径(比如:注册登录等)
        String[] includeUrls = new String[]{"/tsyslogin/actionTSysLogin.do","/tsysuser/queryTSysMenuTreeByUser.do"};
    
    
        @Override
        public void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, FilterChain filterChain) throws IOException, ServletException {
            HttpServletRequest request = (HttpServletRequest) servletRequest;
            HttpServletResponse response = (HttpServletResponse) servletResponse;
            HttpSession session = request.getSession(false);
            String uri = request.getRequestURI();
    
            System.out.println("filter url:"+uri);
            //是否需要过滤
            boolean needFilter = isNeedFilter(uri);
    
    
            if (!needFilter) { //不需要过滤直接传给下一个过滤器
                filterChain.doFilter(servletRequest, servletResponse);
            } else { //需要过滤器
                // session中包含user对象,则是登录状态
                if(session!=null&&session.getAttribute(SdmConst.LOGIN_SESSION_KEY) != null){
                    // System.out.println("user:"+session.getAttribute("user"));
                    filterChain.doFilter(request, response);
                }else{
                    String requestType = request.getHeader("X-Requested-With");
                    //判断是否是ajax请求
                    if(requestType!=null && "XMLHttpRequest".equals(requestType)){
                    }else{
                        response.setCharacterEncoding("UTF-8");
                        response.setContentType("application/json; charset=utf-8");
                        PrintWriter out = response.getWriter();
                        JSONObject res = new JSONObject();
                        res.put("code", "100003");
                        out.append(res.toString());
                    }
                }
            }
        }
    
        /**
         * @Author: xxxxx
         * @Description: 是否需要过滤
         * @Date: 2018-03-12 13:20:54
         * @param uri
         */
        public boolean isNeedFilter(String uri) {
    
            for (String includeUrl : includeUrls) {
                if(includeUrl.equals(uri)) {
                    return false;
                }
            }
    
            return true;
        }
    
        @Override
        public void init(FilterConfig filterConfig) throws ServletException {
    
        }
    
        @Override
        public void destroy() {
    
        }
    }
    
    B.入口程序:
    
    import org.mybatis.spring.annotation.MapperScan;
    import org.springframework.boot.SpringApplication;
    import org.springframework.boot.autoconfigure.SpringBootApplication;
    import org.springframework.boot.autoconfigure.mongo.MongoAutoConfiguration;
    import org.springframework.boot.web.servlet.ServletComponentScan;
    
    /**
     *  注:为了避免扫描路径不一致,请将启动类放在Root Package 即 com.itsource
     */
    @SpringBootApplication(exclude = MongoAutoConfiguration.class)
    @MapperScan("**.itsource.**.mapper")
    @ServletComponentScan
    public class WebApplication {
        public static void main(String[] args) {
            SpringApplication.run(WebApplication.class, args);
        }
    }
    

    3.前端代码

    import axios from 'axios';
    // import qs from 'qs';
    import router from '@/router';
    import ErrorHandling from './error-handling';
    import {Modal} from 'ant-design-vue';
    import Loading from './loading-toast'
    import {crypto} from '../utils';
    import Vue from 'vue';
    import {merge} from 'lodash';
    
    const Error = new ErrorHandling();
    
    /**
     * Axios构造函数
     * @method CreatAxios
     * @param {Object} config
     * @constructor
     */
    function CreatAxios(config = {}) {
      merge({
        // baseURL: '/', // 因为我本地做了反向代理
        timeout: 60 * 1000, // 超时处理
        responseType: 'json', // 响应数据类型
        withCredentials: true, // 是否允许带cookie这些
        headers: {
          // json 或者 x-www-form-urlencoded 自行选择
          // 'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8',
          'Content-Type': 'application/json;charset=utf-8'
        }
      }, config);
    
      const Axios = axios.create(config);
    
      //POST传参序列化(添加请求拦截器)
      Axios.interceptors.request.use(
        config => {
          Loading.open();
          // 在发送请求之前做某件事
          // 温馨提示,若提交能直接接受json 格式,可以不用 qs 来序列化的
          // if (config.method === 'post') {
          //   // 序列化
          //   config.data = qs.stringify(config.data);
          // }
    
          // 开启上送数据加密
          if ((config.hasOwnProperty('encrypt') ? config.encrypt : Vue.config.encrypt) && config.data) {
            config.data = crypto.Encrypt(config.data)
          }
    
          return config;
        },
        error => {
          Loading.close();
          // error 的回调信息
          Modal.error({
            title: '请求失败',
            cancelText: '确定',
            content: error && error.data.error.message
          });
          return Promise.reject(error.data.error.message);
        }
      );
    
      //返回状态判断(添加响应拦截器)
      Axios.interceptors.response.use(
        res => {
          Loading.close();
          //对响应数据做些事
          
          if (res.data) {
            //判断session是否过期
            if (res.data.code === '100003') {
              //
              Modal.error({
                title: '访问错误',
                cancelText: '确定',
                content: '用户登录过期,请重新登录!',
                onOk: () => {
                  router.push({
                    path: '/login'
                  })
                }})
                return
            }
            //请求错误
            if (res.data.code !== '000000') {
              const err_msg = Error.business(res.data);
              // 错误处理
              Modal.error({
                title: '请求错误',
                cancelText: '确定',
                content: err_msg,
                onOk: () => {
                  // router.push({
                  //   path: '/login'
                  // });
                }
              })
            }
            // 响应解密
            if ((res.config.hasOwnProperty('encrypt') ? res.config.encrypt : Vue.config.encrypt) && res.config.data) {
              res.data = crypto.Decrypt(res.data)
            }
          }
          if (res.hasOwnProperty('data')) {
            res = res.data
          }
          return res;
        },
        error => {
          Loading.close();
          const errMsg = Error.server(error.response);
    
          Modal.error({
            title: '服务器错误',
            okText: '确定',
            content: errMsg
          });
    
          return Promise.reject(error);
        }
      );
    
      return Axios;
    }
    
    // 对axios的实例重新封装成一个plugin ,方便 Vue.use(xxxx)
    export default CreatAxios;
    

    以上只是个人的用法,在此做一个记录,仅供参考!

    展开全文
  • 本篇文章小编将为大家介绍,关于Iframe如何跨域访问Cookie和Session的解决方法,有需要的朋友可以参考一下
  • 描述vue在做登录的时候,明明已经把用户数据存入了httpsession中,但在后面的请求拦截中发现获取的session属性size为0断点发现登录用的session和拦截得到的session不是一个id,也就是说不是同一个session查资源得到...
  • 主要介绍了Vue使用axios引起的后台session不同操作,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
  • 主要介绍了前后端分离 vue+springboot 跨域 session+cookie失效问题的解决方法,解决过程也很简单 ,需要的朋友可以参考下
  • Chrome调试时跨站不能设置cookie问题 this set-cookie didn't specify a "SameSite" attribute,然后变成默认Lax。 然后我搜索了一下Samesite定义,有三个值,None, Lax,Strict.... ...找了一下怎么关闭chrome的这个...
  • 本篇文章主要介绍了vue2 前后端分离项目ajax跨域session问题解决方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
  • 1、vue开发后台管理项目,登录后,请求数据每次session都不一致,后台返回未登录,处理方法打开main.js设置: // The Vue build version to load with the `import` command // (runtime-only or standalone) has ...
  • vue使用vue-session 都在npmjs上下载 在跨域的情况下(前后端域名不同),koa后端使用ctx.session保存用户名是不会保存在浏览器前端的。可能体现为每次刷新页面都会失去登录状态。 需要在koa后端的app.js中加入...
  • vue+flask完成登录验证和session的使用

    千次阅读 2019-06-12 21:59:03
    使用vue判断验证用户登录状态 导航钩子类似于生命周期钩子,包含路由进入前,进入后,更新时,退出前等几个周期,主要用于控制导航的前进后退或跳转等。 其中router.beforeEach就是路由进入前的周期,同时有路由...
  • main.js中插入 importaxiosfrom'axios' axios.defaults.withCredentials=true
  • Vue项目和flask框架前后端分离session的坑Vue的项目启动Flask的项目启动前后端分离 Vue的项目启动 一般来说,现在的开发环境都是使用自动化工具进行项目创建和开发。 所以,在测试时,自动化工具会帮我们创建一个...
  • Vue 如何监听session值的变化

    千次阅读 2020-01-18 11:29:45
    如何监听session值的变化 首先在在main.js给Vue.protorype注册一个全局方法 //main.js Vue.prototype.resetSetItem = function (key, newVal) { if (key =='collapse') { // 创建一个StorageEvent事件 var ...
  • vue session

    2021-07-19 11:35:26
  • Vue中跨域以及sessionId不一致问题解决方法

    万次阅读 多人点赞 2018-10-23 16:05:49
    在使用Vue和SpringBoot做前后端分离项目时,会出现以下问题: 前端直接请求数据会出现跨域访问限制的问题。 如果登录时还需要图片验证码验证,首先需要请求获取验证码的接口,然后将验证码存入session中并返回给...
  • vue操作session,保存和获取对象信息 const path = '/user' const tabsData = [] const tab = { path: '/' + path, name: name } tabsData.push(tab) // 保存 window.sessionStorage.setItem('tabsData',...
  • Vue封装local及session

    2021-11-19 14:18:11
    封装local及session,方便后续调用。 1、src目录下创建storge文件夹 ...import Vue from 'vue' import LocalStorage from './storge.local' import SessionStorage from './storge.session' //原型链设...
  • Vue 中 使用 vue-cookies和vue-session

    万次阅读 2019-05-17 10:33:18
    一、Vue中使用vue-session 1.npm 安装 vue-session npm install vue-session 2.在main.js中引入 import VueSession from 'vue-session' Vue.use(VueSession) 3.使用 this.$session.set("key",value); //存...
  • 4.Vue跨域session问题解决
  • Vue+NodeJS的跨域请求如何保存session

    千次阅读 2017-08-04 21:46:36
    今天一直在练习如何使用Vue,就把自己之前用node写的个人博客改改,拿来当接口,涉及到跨域请求的问题,接下来简单的说下自己所遇到的问题,和解决方法。一. 用cors来实现跨域请求:一想到跨域请求,脑子里首先出现...
  • 1.npm install axios 2.设置请求头允许携带cookid
  • } //添加 public synchronized void addSession(HttpSession session) { if(session!= null) { map.put(session.getId(), session); } } //获取 public synchronized HttpSession getSession(String sessionId) { ...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 27,359
精华内容 10,943
关键字:

session vue