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>
相关推荐
坚果派·白晓明1 天前
【鸿蒙PC三方库移植适配框架解读系列】第八篇:扩展lycium框架使其满足rust三方库适配
c语言·开发语言·华为·rust·harmonyos·鸿蒙
花间相见1 天前
【PaddleOCR教程01】PP-OCRv5 全面指南:从模型架构到实战部署
开发语言·r语言
小短腿的代码世界1 天前
Qt 股票订单撮合引擎:高频交易系统的核心心脏
开发语言·数据库·qt·系统架构·交互
不会敲代码11 天前
手写 Zustand:三十分钟带你搞懂状态管理库的核心原理
前端·javascript·源码
神奇的程序员1 天前
重构了自己5年前写的截图插件
前端·javascript·架构
橙淮1 天前
从优化到安全再到未来 ——JavaScript 全维度技术指南
javascript
谙弆悕博士1 天前
快速学C语言——第16章:预处理
c语言·开发语言·chrome·笔记·创业创新·预处理·业界资讯
诚实可靠王大锤1 天前
React Native 输入框与按钮焦点冲突解决方案(rn版本0.70.3)
前端·javascript·react native·react.js
yuan199971 天前
基于 C# 实现的 Omron HostLink (FINS) 协议 PLC 通讯
开发语言·c#
qq_422828621 天前
android图形学之SurfaceControl和Surface的关系 五
android·开发语言·python