uniapp 长时间不操作,自动退出登录页

store 下的inex.js文件

javascript 复制代码
import Vue from 'vue'
import Vuex from 'vuex'


Vue.use(Vuex)

const store = new Vuex.Store({
	state: {
		// 记录最后一次点击时间的元素
		lastTime: new Date().getTime(),
	},
	mutations: {
		//点击事件调用,刷新最后一次点击时间
		lastTimeUpdata: (state, lastTime) => {
			state.lastTime = lastTime;
		}
	},
	actions: {}
})
export default store

time.js

javascript 复制代码
import store from '../store/index.js';
export const timeOut = () => {
	let WebviewList = [];
	// 上一次点击时间
	let lastTime = null
	// 当前时间
	let currentTime = null
	// 超时时间【可以自己设置】
	// let sys_timeout = 5 * 1000
	let sys_timeout = 30 * 60 * 1000
	// 每隔多长时间检查是否超时【可以自己设置】
	let check_time = 1000
	// 计时器【此为功能实现的方法,现在为空】	
	let goOut = null
	const isTimeOut = () => {
		// 页面上一次的点击时间
		lastTime = store.state.lastTime
		currentTime = new Date().getTime()
		// 超时了
		if ((currentTime - lastTime) > sys_timeout) {
			return true;
		} else {
			return false;
		}
	}
	const isLoginOut = () => {
		clearInterval(goOut);
		//setInterval方法来确定多长时间检测一次有没有超时
		goOut = setInterval(() => {

			// #ifdef APP-PLUS
			var pages = getCurrentPages();
			var page = pages[pages.length - 1];
			var currentWebview = page.$getAppWebview();
			// console.log(currentWebview); //获得当前webview的id

			// 判断一下是否超时,如果超时了就退出
			if (isTimeOut()) {
				if (currentWebview.__uniapp_route != 'pages/index/index') {
					// 需要转到的页面【这里用你自己的跳转方法和地址】
					uni.reLaunch({
						url: `/pages/index/index`,
					});
				}
				//已经超时跳转到相应界面,不需要计时了
				// clearInterval(goOut)
			} else {

			}
			let flag = false;
			for (let webview of WebviewList) {
				if (webview.__uniapp_route == currentWebview.__uniapp_route) {
					flag = true;
				}
			}
			if (!flag) {
				WebviewList.push(currentWebview);
				currentWebview.addEventListener('touchstart', function() {
					console.log('点击了');
					store.commit('lastTimeUpdata', new Date().getTime());
				}, false);
				currentWebview.addEventListener('close', function() {
					// console.log('关闭了');
					for (var i = 0; i < WebviewList.length; i++) {
						if (WebviewList[i].__uniapp_route == currentWebview
							.__uniapp_route) {
							WebviewList.splice(i, 1);
						}
					}
				}, false);
			}

			// #endif

			// #ifdef H5
			if (isTimeOut()) {
				// 需要转到的页面【这里用你自己的跳转方法和地址】
				uni.reLaunch({
					url: `/pages/index/index`,
				});
				//已经超时跳转到相应界面,不需要计时了
				// clearInterval(goOut)
			}
			// #endif


		}, check_time);
	}
	isLoginOut();
}

main.js 挂载全局

javascript 复制代码
import store from './store/index.js'
Vue.prototype.$store = store

app.vue文件引用

javascript 复制代码
<script>
import { timeOut } from './common/time.js';
export default {
	onLaunch: function() {
		let that = this;
		console.log('App Launch');
		timeOut();
		// #ifdef H5
		// /* 实现全局点击事件监听 */
		setTimeout(function() {
			var body_ = document.getElementsByTagName('body')[0];
			body_.addEventListener('click', function() {
				that.$store.commit('lastTimeUpdata', new Date().getTime());
			});
		}, 1000);
		// #endif
	},
	onShow: function() {
		console.log('App Show');
	},
	onHide: function() {
		console.log('App Hide');
	}
};
</script>
相关推荐
WeiShuai11 分钟前
vue-cli3使用DllPlugin优化webpack打包性能
前端·javascript
重生之我要进大厂13 分钟前
LeetCode 876
java·开发语言·数据结构·算法·leetcode
forwardMyLife15 分钟前
element-plus的面包屑组件el-breadcrumb
javascript·vue.js·ecmascript
Amo Xiang29 分钟前
Python 常用模块(四):shutil模块
开发语言·python
Happy鱿鱼1 小时前
C语言-数据结构 有向图拓扑排序TopologicalSort(邻接表存储)
c语言·开发语言·数据结构
KBDYD10101 小时前
C语言--结构体变量和数组的定义、初始化、赋值
c语言·开发语言·数据结构·算法
计算机学姐1 小时前
基于python+django+vue的影视推荐系统
开发语言·vue.js·后端·python·mysql·django·intellij-idea
Crossoads1 小时前
【数据结构】排序算法---桶排序
c语言·开发语言·数据结构·算法·排序算法
扎克begod1 小时前
JAVA并发编程系列(9)CyclicBarrier循环屏障原理分析
java·开发语言·python
code bean1 小时前
【C#基础】函数传参大总结
服务器·开发语言·c#