Vue3:同一项目同一浏览器只允许打开一个标签页

说明:

阻止同一浏览器打开多个项目标签页,防止多标签页重复时间统计累加,适用于基于微信公众号页面或指定浏览器的计时统计等项目活动,计时在线学习时间统计等。 

效果:

main.js

import {createApp} from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
const app = createApp(App).use(router).use(store);//其他代码//检测打开
if ((navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i))) {//alert("手机端")  // 手机端app.mount('#app')
} else {//alert("PC端")  //PC端// 检查是否已有实例打开if (localStorage.getItem('milliaPageOpened') !== null) {alert('已有一个实例在运行!')window.close()} else {// 没有实例在运行,设置标记,并继续初始化应用localStorage.setItem('milliaPageOpened', 'true')// 监听页面关闭事件,以便在关闭时清除标记window.addEventListener('beforeunload', () => {localStorage.removeItem('milliaPageOpened')})app.mount('#app')}
}//app.mount('#app')//其他代码

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/882289.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【Linux系统编程】第三十四弹---使用匿名管道构建简易Linux进程池

✨个人主页: 熬夜学编程的小林 💗系列专栏: 【C语言详解】 【数据结构详解】【C详解】【Linux系统编程】 目录 1、引言 2、进程池的基本概念 3、管道在进程池中的应用 4、进程池的实现 4.1、master类定义 4.2、测试信道 4.3、通过cha…

OpenCV高级图形用户界面(12)用于更改指定窗口的大小函数resizeWindow()的使用

操作系统:ubuntu22.04 OpenCV版本:OpenCV4.9 IDE:Visual Studio Code 编程语言:C11 算法描述 cv::resizeWindow() 函数用于更改指定窗口的大小。这使得你可以根据需要调整窗口的宽度和高度。 注释 指定的窗口大小是指图像区域的大小。工具栏…

Linux 手撕线程池

前言 线程池 是 池化技术 中很典型的一个,它旨在高效的管理和复用线程资源!在现在的计算机体系中,线程是执行任务(调度)的基本单位。然而,频繁的创建和销毁线程也会带来较大的开销,包括系统资源…

区块链开发入门: 原理、技术与实践

随着区块链技术的迅猛发展,它不仅改变了金融领域,还对供应链、医疗、身份认证等多个行业产生了深远影响。对于想要进入区块链开发领域的初学者而言,了解区块链的基本原理、相关技术以及实际应用场景至关重要。本文将为您提供一份全面的区块链…

网络变压器在PCIe网口应用的案例

PCIe(Peripheral Component Interconnect Express)是一种高速串行计算机总线标准,用于连接计算机主板上的设备,如显卡、网络适配器、存储控制器等。H82422S 网络变压器(Ethernet Transformer),在…

[Git]一文速通

概述 Git是一个分布式版本控制工具,主要用于管理开发过程中的源代码文件(Java类、xml文件、html页面等, )在软件开发过程中被广泛使用 Git的作用 代码回溯版本切换多人协作远程备份 通过Git 仓库来存储和管理代码 文件,Git 仓库分为两种: 本地仓库: 开…

循序渐进丨在 MogDB 数据库中实现 Oracle ASH能力

我们都知道,当 Oracle 数据库出现性能故障后,一般会在线上实时诊断数据库性能问题,特别是资源突然打高的场景,这个时候用到ASH的数据,就能很大程度上准确定位问题所在。 Oracle ASH 在 Oracle 数据库中,实…

基于微博评论的自然语言处理情感分析

目录 一、项目概述 二、需要解决的问题 三、数据预处理 1、词汇表构建(vocab_creat.py) 2、数据集加载(load_dataset.py) 四、模型构建(TextRNN.py) 1、嵌入层(Embedding Layer&#xff…

【学术会议论文投稿】ECMAScript标准:塑造现代Web开发的基石

https://www.ais.cn/attendees/index/MVNV3U 更多学术会议论文投稿请看:https://ais.cn/u/nuyAF3 目录 引言 ECMAScript的历史背景与版本更新 ECMAScript的核心特性 1. 变量和数据类型 2. 变量声明 3. 运算符 4. 控制流语句 5. 函数 6. 错误处理 7. 模板…

github学生认证(Github Copilot)

今天想配置一下Github Copilot,认证学生可以免费使用一年,认证过程中因为各种原因折腾了好久,记录一下解决方法供大家参考。 p.s.本文章只针对Github学生认证部分遇到的问题及解决方法,不包括配置copilot的全部流程~ 1、准备工作…

构建后端为etcd的CoreDNS的容器集群(六)、编写自动维护域名记录的代码脚本

本文为系列测试文章,拟基于自签名证书认证的etcd容器来构建coredns域名解析系统。 一、前置文章 构建后端为etcd的CoreDNS的容器集群(一)、生成自签名证书 构建后端为etcd的CoreDNS的容器集群(二)、下载最新的etcd容…

Github 2024-10-19 Rust开源项目日报 Top10

根据Github Trendings的统计,今日(2024-10-19统计)共有10个项目上榜。根据开发语言中项目的数量,汇总情况如下: 开发语言项目数量Rust项目10Python项目2Dart项目1TypeScript项目1Vue项目1CUE项目1RustDesk: 用Rust编写的开源远程桌面软件 创建周期:1218 天开发语言:Rust, …

敏捷Scrum项目管理方法,如何做好敏捷项目管理❓

在当今快速变化的商业环境中,项目管理方法的选择对于项目的成功至关重要。敏捷Scrum作为一种轻量级、迭代式的项目管理方法,因其灵活性和高效性而备受推崇。作为项目经理,掌握敏捷Scrum项目管理方法不仅有助于提升项目交付效率,还…

2024年软件设计师中级(软考中级)详细笔记【7】面向对象技术(上)(分值10+)

目录 前言第7章 面向对象技术 (上)7.1 面向对象基础(3-4分)7.1.1 面向对象的基本概念7.1.2 面向对象分析(熟记)7.1.3 面向对象设计7.1.4 面向对象程序设计7.1.5 面向对象测试 7.2 UML(3~4分)7.2.1 事务7.2.2 关系7.2.2…

Qt 支持打包成安卓

1. 打开维护Qt,双击MaintenanceTool.exe 2.登陆进去,默认是添加或移除组件,点击下一步, 勾选Android, 点击下一步 3.更新安装中 4.进度100%,完成安装,重启。 5.打开 Qt Creator,编辑-》Preferences... 6.进…

Windows下配置Nginx和PHP

之前在Windows开发php项目用的是phpstudy,好用的很。但是phpstudy好久没有更新了,感觉PHP像没有人再用了一样。但是PHP拿来开发小系统,还是很高效的,今天记录如何在Windows环境下配置Nginx和PHP。 1. 配置nginx Nginx软件下载解压…

【Python】selenium遇到“InvalidArgumentException”的解决方法

在使用try……except 的时候捕获到这个错误: InvalidArgumentException: invalid argument (Session info: chrome112.0.5614.0) 这个错误代表的是,当传入的参数不符合期望时,就会抛出这个异常: InvalidArgumentException: invali…

【C#】使用vue3的axios发起get和post请求.net framework部署的API显示跨域

欢迎来到《小5讲堂》 这是《C#》系列文章,每篇文章将以博主理解的角度展开讲解。 温馨提示:博主能力有限,理解水平有限,若有不对之处望指正! 目录 前言跨域提示解决方案现状跨域疑问跨域概念相关文章 前言 最近在对接…

React高级Hook

useReducer useReducer 是 React 提供的一个 Hook,用于在函数组件中使用 reducer 函数来管理组件的 state。它类似于 Redux 中的 reducer,但仅用于组件内部的状态管理。useReducer 可以使复杂的状态逻辑更加清晰和可维护。 基本用法 useReducer 接收…

Linux——网络层协议

前言 网络层:在复杂的网络环境中确定一个合适的路径 目录 前言 一IP协议 1预备知识 2基本概念 3格式 4网段划分 4.1理解IP 4.2IP组成 4.3划分方式 4.4为什么要网段划分 5特殊的IP地址 6IP地址的限制 7私有IP和公网IP 8NAT技术 9理解公网 10路由 …