在小程序中,保持登录状态是很常见的需求,今天就把写一写使用uni-app框架的保持登录状态功能是怎样实现的。

一、场景需求

1、场景:初始打开---登陆---关闭,再次打开---(已登录)上次关闭前的页面

2、cookie:传统应用保持登录状态的方式是通过读取 cookie 来判断是否是登录状态,但是uni-app不支持对cookie的读写。

3、实现:uni-app 的官网的API 有这样一栏“数据缓存”,而且uni-app框架的主体是 VUE,那么我们就用 uni.setStorage 和  vuex  进行登录状态管理。

二、实现过程

1、vuex的声明和使用 请看 《uni-app 使用Vuex+ (强制)登录

2、在store/index.js 中

3、在App.vue

  每次进入应用前,由App.vue 中的周期函数进行监听,所以在加载函数中定义方法,从本地缓存中取出用户数据,然后调用login方法,不需要发起网络登录请求。

这样就实现了,只有不清除本地缓存,每次打开小程序应用时,都是登录状态

三、总结

看到文档,有同步和异步这两种缓存数据,那么关于同步缓存和异步缓存的区别:
以Sync结尾的都是都是同步缓存,二者的区别是,异步不会阻塞当前任务,同步缓存直到同步方法处理完才能继续往下执行。
通俗点说,同步就是你下步操作需要上一步必须完成才能往下执行,异步就是下面的代码和这个操作没什么关系就用异步啦。
使用异步,性能会更好;而使用同步,数据会更安全。

1、所以在App.vue中,先是使用了let userInfo  = uni.getStorageInfoSync('userInfo')||''; 同步去获取缓存的数据,因为后续的操作依赖于更改storage后的数据,则需要同步。

2、在使用setStorageSync和setStorage的时发现setStorageSync不能传入对象

uni-app 保持登录状态 (Vuex)的更多相关文章

  1. App保持登录状态的常用方法(转)

    我们在使用App时,一次登录后App如果不主动退出登录或者清除数据,App会在很长一段时间内保持登录状态,或者让用户感觉到登录一次就不用每次都输入用户密码才能进行登录.银行.金融涉及到支付类的App一 ...

  2. App保持登录状态的常用方法

    我们在使用App时,一次登录后App如果不主动退出登录或者清除数据,App会在很长一段时间内保持登录状态,或者让用户感觉到登录一次就不用每次都输入用户密码才能进行登录.银行.金融涉及到支付类的App一 ...

  3. 如何维持App拥护登录状态(仅仅理论)

    这个问题太过于常见,也过于简单,以至于大部分开发者根本没有关注过这个问题,我根据和我沟通的开发者中,总结出来常用的方法有以下几种: 一:服务端默认的session 这种方式最大的优点是服务端不用增加任 ...

  4. 黄聪:保持web页面生成的app一直处于用户登录状态不退出

    用户登录了会员中心,怎么保持登录状态! 由于封壳的内核及组件肯定没有浏览器APP应用那么强大,所以目前暂时的解决方案是: jquery.cookie.js  本文转载至:https://www.cnb ...

  5. App登录状态维持

    转载地址:http://www.jianshu.com/p/4b6b04244773 目前APP大都支持长登录,就是用户登录一次后,如果用户没有主动注销.清除APP缓存数据或卸载APP,就在一段时间内 ...

  6. vuex实现登录状态的存储,未登录状态不允许浏览

    基础思路就是使用vuex状态管理来存储登录状态(其实就是存一个值,例如token),然后在路由跳转前进行登录状态的判断,可以使用vue-router的全局前置守卫beforeEach,也可以使用路由独 ...

  7. Vue管理系统前端系列三登录页和首页及`vuex`管理登录状态

    目录 登录页面设计 vuex 对应 用户模块 丰富界面 首页相关代码 登录页面设计 该节记录了登录界面的设计,以及 vuex 的简单实用,然后将首页简单搭建完成. 先看最终效果图 先在 views 文 ...

  8. vue用户登录状态判断

    之前项目中用来判断是否登录我写了多种方案,但是最终只有一个方案是比较好的,这篇博客就是分享该方案; 先说基本要求: 项目中的登录状态是依据服务器里的状态来作为判断依据; 每一个需要登录后才能操作的接口 ...

  9. nuxt如何处理用户登录状态持久化:nuxtServerInit 页面渲染前的store处理

    vue-cli项目中,我们可以用vuex-persistedstate,它可以使vuex的状态持久化,页面刷新都不会丢失,原理当然是localStorage啦!当然也可以使用vue-cookies进行 ...

随机推荐

  1. 配置tmux在机器重启后自动恢复tmux工作现场,告别重启恐惧症

    1. 问题出现的背景 通过ssh远程登录服务器在上面工作,有时候很有可能由于网络断开而导致ssh链接断开,或者下班后想继续在家登录到服务器继续工作.这些情况都需要服务器保持我们的工作环境,比如,vim ...

  2. 各位大佬Python的第一部分道基础题已经整理好了,希望大家面试的时候能用的上。

    Python的第一部分道基础题,希望大家面试的时候能用的上. 1.为什么学习Python? Python是目前市面上,我个人认为是最简洁.最优雅.最有前途.最全能的编程语言,没有之一. 2.通过什么途 ...

  3. openpose-opencv 的body数据多人体姿态估计

    介绍 opencv除了支持常用的物体检测模型和分类模型之外,还支持openpose模型,同样是线下训练和线上调用.这里不做特别多的介绍,先把源代码和数据放出来- 实验模型获取地址:https://gi ...

  4. Paper Reading:推荐系统评价指标综述

    论文:推荐系统评价指标综述 发表时间:2012 发表作者:朱郁筱,吕琳媛 论文链接:论文链接 本文对现有的推荐系统评价指标进行了系统的回顾,总结了推荐系统评价指标的最新研究进展,从准确度. 多样性.新 ...

  5. windwos服务器 无法与本地电脑进行复制粘贴解决办法

    之前复制粘贴功能可以使用  现在突然间不能使用了 1.打开任务管理器,查看进程,如果有 rdpclip.exe 进程,先关闭该进程2.开始->运行->rdpclip.exe,重新运行此程序 ...

  6. TCP/UDP Socket调试工具提供了TCP Server,TCP Client,UDP Server,UDP Client,UDP Group 五种Socket调试方案。

    一.TCP通信测试: 1)   创建TCP Server: 选中左方的TCP Server, 然后点击”创建”按钮,软件弹出监听端口输入框 输入监听端口后,即创建了一个在指定端口上进行监听的TCP S ...

  7. python中常用的九种预处理方法

    本文总结的是我们大家在python中常见的数据预处理方法,以下通过sklearn的preprocessing模块来介绍; 1. 标准化(Standardization or Mean Removal ...

  8. 传说中Python最难理解的点,看这完篇就够了

    本文转载自简书,作者为菜鸟,感谢作者的辛苦付出. 这不是我第一次学Python入门课,去年.前年我都学过Python入门.所以文章的标题一点都没有标题党的意思.但是整个入门篇还有一个最难的东西没有讲, ...

  9. JavaScript各种窗口尺寸

    浏览器窗口可视区域大小 网页尺寸scrollHeight 网页尺寸offsetHeight

  10. 2019牛客多校B generator 1——十进制快速幂

    题目 已知 $x_i = ax_i + bx_{i-1}$,求 $x_n \% MOD$.($1\leq n\leq 10^{(10^6)}$) 分析 写成矩阵快速幂的形式,相当于求转移矩阵的 $n$ ...