JS获取当前电脑浏览器基本信息

62 ℃

功能介绍:如何利用js语法获取用户代理(User-Agent)、浏览器(Browser)、版本(Version)、渲染引擎(Engine)、操作系统(System)、系统平台(Platform)、屏幕尺寸(Screen size)、剩余电量(Battery)、支持字体(Font Family)等基本信息!

具体实现代码如下:

(async function() {
  const info = {};
  info["User-Agent"] = navigator.userAgent;
  const ua = navigator.userAgent;
  let browser = "Unknown",
  version = "Unknown";
  if (ua.includes("Chrome") && !ua.includes("Edg")) {
    browser = "Chrome";
    const match = ua.match(/Chrome\/([\d.]+)/);
    if (match) {
      version = match[1];
    }
  } else if (ua.includes("Firefox")) {
    browser = "Firefox";
    const match = ua.match(/Firefox\/([\d.]+)/);
    if (match) {
      version = match[1];
    }
  } else if (ua.includes("Safari") && !ua.includes("Chrome")) {
    browser = "Safari";
    const match = ua.match(/Version\/([\d.]+)/);
    if (match) {
      version = match[1];
    }
  } else if (ua.includes("Edg")) {
    browser = "Edge";
    const match = ua.match(/Edg\/([\d.]+)/);
    if (match) {
      version = match[1];
    }
  } else if (ua.includes("OPR") || ua.includes("Opera")) {
    browser = "Opera";
    const match = ua.match(/OPR\/([\d.]+)/);
    if (match) {
      version = match[1];
    }
  } else if (ua.includes("Trident") || ua.includes("MSIE")) {
    browser = "Internet Explorer";
    const match = ua.match(/(?:MSIE |rv:)([\d.]+)/);
    if (match) {
      version = match[1];
    }
  }
  info["Browser"] = browser;
  info["Version"] = version;
  let engine = "Unknown";
  if (ua.includes("WebKit")) engine = "WebKit";
  else if (ua.includes("Gecko")) engine = "Gecko";
  else if (ua.includes("Trident")) engine = "Trident";
  info["Engine"] = engine;
  let os = "Unknown";
  if (ua.includes("Windows")) os = "Windows";
  else if (ua.includes("Mac OS")) os = "macOS";
  else if (ua.includes("Linux")) os = "Linux";
  else if (ua.includes("Android")) os = "Android";
  else if (ua.includes("iPhone") || ua.includes("iPad")) os = "iOS";
  info["System"] = os;
  info["Platform"] = navigator.platform;
  info["Screen size"] = `${screen.width}x${screen.height}`;
  info["Client size"] = `${window.innerWidth}x${window.innerHeight}`;
  if (navigator.userAgentData) {
    const {
      architecture
    } = navigator.userAgentData;
    info["Architecture"] = architecture
  } else {
    info["Architecture"] = ''
  }
  const isMobile = /Mobi|Android|iPhone|iPad/i.test(ua);
  info["Device type"] = isMobile ? "Mobile": "Desktop";
  info["Device Pixel Ratio"] = window.devicePixelRatio;
  info["Device Memory"] = navigator.deviceMemory || "Unknown";
  const canvas = document.createElement("canvas");
  const gl = canvas.getContext("webgl") || canvas.getContext("experimental-webgl");
  let gpu = "Unknown";
  if (gl) {
    const debugInfo = gl.getExtension("WEBGL_debug_renderer_info");
    if (debugInfo) {
      gpu = gl.getParameter(debugInfo.UNMASKED_RENDERER_WEBGL)
    }
  }
  info["GPU model"] = gpu;
  info["Language"] = navigator.language;
  info["Timezone"] = Intl.DateTimeFormat().resolvedOptions().timeZone;
  info["Is Online"] = navigator.onLine;
  if ("getBattery" in navigator) {
    const battery = await navigator.getBattery();
    info["Battery"] = `${(battery.level * 100).toFixed(0)}%`;
    info["Is charging"] = battery.charging;
  } else {
    info["Battery"] = "Unavailable";
    info["Is charging"] = "Unavailable"
  }
  const isBot = /bot|crawler|spider|slurp|teoma/i.test(ua);
  info["Is robot"] = isBot;
  const isWebview = /wv|webview/i.test(ua);
  info["Is Webview"] = isWebview;
  info["Is Touch Screen"] = "ontouchstart" in window;
  info["Is Support WebGL"] = !!gl;
  info["Font Family"] = getComputedStyle(document.body).fontFamily;
  console.log('info', info)
})();

进入案列官网入口

JS代码格式化后无法运行一般有哪些问题导致的?

js文章太长显示部分(百分比),点击按钮显示全部

cookie存储教程:Chrome浏览器保存位置(设置/获取Cookie)

javascript块级作用域是什么(代码介绍)

javascript函数作用域是什么(代码介绍)

标签: Chrome浏览器, js代码

上面是“JS获取当前电脑浏览器基本信息”的全面内容,想了解更多关于 js 内容,请继续关注web建站教程。

当前网址:https://m.ipkd.cn/webs_20194.html

声明:本站提供的所有资源部分来自互联网,如果有侵犯您的版权或其他权益,请发送到邮箱:admin@ipkd.cn,我们会在看到邮件的第一时间内为您处理!

生活小工具

收录了万年历、老黄历、八字智能排盘等100+款小工具!生活小工具
为什么页面标题,只有一个关键词?
MySQL的并发控制技巧之锁机制(Locking)和乐观锁(Optimistic Locking)
js多个数组交叉合并
git教程之远程仓库
在访问WordPress网站时,页面出现示空白是什么原因(附解决方法)