前端通过vue获取浏览器类型和版本最新

news/2024/12/29 19:26:04/

新建一个js文件,我的命名是browserVersion.js

/* 判断各个浏览器版本号 */
function matchVesion() {let userAgent = navigator.userAgent;let rMsie = /(msie\s|trident.*rv:)([\w.]+)/;let rEdge = /(edg)\/([\w.]+)/;let rFirefox = /(firefox)\/([\w.]+)/;let rOpera = /(opera).+version\/([\w.]+)/;let rChrome = /(chrome)\/([\w.]+)/;let rSafari = /version\/([\w.]+).*(safari)/;let ua = userAgent.toLowerCase();var match = rMsie.exec(ua);if (match !== null) {return {browser: "IE",version: match[2] || "0"};}var rEmatch = rEdge.exec(ua);if (rEmatch !== null) {return {browser: 'Edge',version: rEmatch[2] || "0"};}var rFmatch = rFirefox.exec(ua);if (rFmatch !== null) {return {browser: rFmatch[1] || "",version: rFmatch[2] || "0"};}var rOmatch = rOpera.exec(ua);if (rOmatch !== null) {return {browser: rOmatch[1] || "",version: rOmatch[2] || "0"};}var rCmatch = rChrome.exec(ua);if (rCmatch !== null) {return {browser: rCmatch[1] || "",version: rCmatch[2] || "0"};}var rSmatch = rSafari.exec(ua);if (rSmatch !== null) {return {browser: rSmatch[2] || "",version: rSmatch[1] || "0"};}if (match !== null) {return {browser: "",version: "0"};}
}export default function initBrowserVersion() {let browserMatch = matchVesion();return browserMatch;
}

需要用到的地方引入这个js文件,直接调用就可以

import browserVersion from '../../base/utils/browserVersion';

结果:
在这里插入图片描述

edge浏览器匹配是edg不是edge!!!!搜了好多博客全是edge根本匹配不到这个浏览器好吗,我是用在埋点里的,其他功能自行导入这个js文件


http://www.ppmy.cn/news/700374.html

相关文章

如何查看当前所用浏览器版本是否支持Vue3+ElementUIPlus

1. elementui-plus环境支持: 来源:Element Plus - The worlds most popular Vue 3 UI framework 2. 查看当前浏览器以及版本 2.1 查看用的是什么浏览器 function userBrowser () {var browserName navigator.userAgent.toLowerCase();if(/mise/i.test…

查看计算机安装程序版本,查看电脑中安装的360浏览器版本信息的方法

? 我们知道360浏览器是一款基于IE和Chrome双内核的浏览器,受到很多用户的喜爱,是家庭和工作 电脑系统 中常使用的浏览器。软件产品一直都在进行更新,我们有必要知道目前使用的浏览器的版本信息。因此,下面是两种查看360浏览器版本…

查看浏览器内核版本测试网站

自用浏览器内核检测,js代码。查看浏览器版本。 /*! browsecore v0.1 | (c) 2017 osfipin*/ (function (w) {"use strict";var n w.navigator,d w.document;var r [];r.isIE ("number" typeof d.documentMode)?d.documentMode:false;//Tri…

svn版本库浏览器_版本库浏览器

版本库浏览器 有时候我们需要在版本库中直接进行操作,而不是在工作副本中。这就是我们的版本库浏览器可以做到的。正如资源管理器和能浏览你的工作副本一样,版本库浏览器允许你浏览版本库的结构和状态。 图 5.45. 版本库浏览器 在版本库浏览器中你可以执行比如复制,转移,重…

JS获取浏览器版本号

通过JS获取浏览器版本 点关注不迷路,欢迎再来!精简博客内容,尽量已专业术语来分享。 努力做到对每一位认可自己的读者负责。 帮助别人的同时更是丰富自己的良机。 最近在处理前端问题时发现浏览器兼容问题,尤其是IE10以下&#x…

如何查看浏览版本号

操作步骤: 1:点击浏览器右上角或者 2:弹出菜单,选择“帮助” 3:弹出菜单中,选择“关于xx” 竟然有人问我这个问题~~~并且要我写一个教程~~~~~~,就分享一下子

查看浏览器内核以及版本信息

如何查看浏览器内核以及版本信息 昨天,一位同事在测试浏览器兼容性问题时,在软件支持版本中的IE8版本测试发现问题,开发反馈是说“浏览器内核版本是IE7的,所以不兼容” 我这才知道浏览器还有内核版本,所以以此文章记录…

setup语法糖插件 : 解决import { ref , reactive ... } 引入的问题(安装unplugin-auto-import 插件)

1. 下载安装 npm i unplugin-auto-import -D 2. 在vite.config.js中进行配置 import { defineConfig } from vite; import vue from vitejs/plugin-vue; import AutoImport from unplugin-auto-import/vite; import path from path; // 静态导入 path 模块export default defi…