js怎么获取设备信息

· 日常编程 · 234078

在javascript中获取设备信息需区分浏览器和node.js环境；2. 浏览器中通过navigator对象获取useragent、platform、language等信息，并结合正则或第三方库解析浏览器类型；3. node.js中使用os和process模块获取操作系统类型、cpu架构、内存、主机名及node版本；4. 判断移动设备应结合useragent关键词和触摸支持特性（如'ontouchstart'或maxtouchpoints）；5. navigator.useragent不可靠因可被用户修改、浏览器厂商调整或隐私策略限制；6. 兼容性处理应采用特性检测、polyfill、第三方库、渐进增强、多环境测试和错误处理等策略；7. 注意隐私安全，避免过度收集信息，防止设备指纹追踪。

获取设备信息，在JavaScript里其实挺微妙的。你得区分是在浏览器环境还是Node.js环境，这俩获取方式完全不一样。浏览器里主要是靠navigator对象，Node.js则需要一些额外的模块。

解决方案

浏览器环境：navigator对象

浏览器里，navigator对象是你的好朋友。它暴露了各种关于浏览器和操作系统的信息。但是，注意！不同浏览器对navigator的实现可能略有差异，所以要做好兼容性处理。

// 获取用户代理字符串
const userAgent = navigator.userAgent;
console.log("User Agent:", userAgent);

// 获取平台信息 (例如 "Win32", "Linux x86_64", "MacIntel")
const platform = navigator.platform;
console.log("Platform:", platform);

// 获取浏览器名称（不完全可靠，userAgent更常用）
const appName = navigator.appName;
console.log("App Name:", appName);

// 获取浏览器版本（不完全可靠，userAgent更常用）
const appVersion = navigator.appVersion;
console.log("App Version:", appVersion);

// 获取语言
const language = navigator.language || navigator.userLanguage; // 兼容不同浏览器
console.log("Language:", language);

// 获取设备是否支持触摸
const touchEnabled = ('ontouchstart' in window) || (navigator.maxTouchPoints > 0) || (navigator.msMaxTouchPoints > 0);
console.log("Touch Enabled:", touchEnabled);

User Agent字符串解析：

userAgent字符串包含了大量信息，但直接使用起来比较麻烦。你可以用正则表达式或者专门的库来解析它，提取出操作系统、浏览器类型、版本等信息。

function getBrowserInfo() {
  const ua = navigator.userAgent;
  let tem;
  let M = ua.match(/(opera|chrome|safari|firefox|msie|trident(?=\/))\/?\s*(\d+)/i) || [];
  if (/trident/i.test(M[1])) {
    tem = /\brv[ :]+(\d+)/g.exec(ua) || [];
    return 'IE ' + (tem[1] || '');
  }
  if (M[1] === 'Chrome') {
    tem = ua.match(/\b(OPR|Edge)\/(\d+)/);
    if (tem != null) return tem.slice(1).join(' ').replace('OPR', 'Opera');
  }
  M = M[2] ? [M[1], M[2]] : [navigator.appName, navigator.appVersion, '-?'];
  if ((tem = ua.match(/version\/(\d+)/i)) != null) {
    M.splice(1, 1, tem[1]);
  }
  return M.join(' ');
}

console.log("Browser Info:", getBrowserInfo());

Node.js环境：os和process模块

Node.js里，navigator不存在。你需要使用os和process模块。

const os = require('os');
const process = require('process');

// 获取操作系统类型 (例如 'Windows_NT', 'Linux', 'Darwin')
const osType = os.type();
console.log("OS Type:", osType);

// 获取操作系统版本
const osRelease = os.release();
console.log("OS Release:", osRelease);

// 获取CPU架构 (例如 'x64', 'arm64')
const osArch = os.arch();
console.log("OS Architecture:", osArch);

// 获取主机名
const hostname = os.hostname();
console.log("Hostname:", hostname);

// 获取Node.js版本
const nodeVersion = process.version;
console.log("Node.js Version:", nodeVersion);

// 获取CPU信息
const cpus = os.cpus();
console.log("CPUs:", cpus); // 返回一个数组，包含每个CPU的信息

// 获取内存信息
const totalMemory = os.totalmem();
const freeMemory = os.freemem();
console.log("Total Memory:", totalMemory);
console.log("Free Memory:", freeMemory);

更深入的设备信息获取：

无论是浏览器还是Node.js，直接获取设备型号、制造商等信息都比较困难。

  • 浏览器： 可以考虑使用第三方库，例如bowser，它可以更精确地解析userAgent字符串。或者，如果你的应用是PWA，可以使用Web APIs，比如Battery API（获取电池信息），Network Information API（获取网络连接信息）。但这些API的兼容性和权限问题需要注意。
  • Node.js： 可以尝试一些系统信息收集的npm包，例如systeminformation。但要注意，这些包可能需要安装额外的系统依赖，并且可能存在跨平台兼容性问题。

安全性和隐私：

获取设备信息时，务必注意用户隐私。不要收集不必要的敏感信息，并确保遵循相关的隐私政策和法规。 尤其是在浏览器环境，过度收集设备信息可能会被认为是fingerprinting，对用户隐私造成威胁。

如何判断用户是否使用了移动设备？

判断用户是否使用了移动设备，最常用的方法还是通过navigator.userAgent。但是，直接判断字符串是否包含"Mobile"或者"Android"这样的关键词并不靠谱，因为很多桌面浏览器也可能伪装成移动设备。

更可靠的方法是结合userAgent和navigator.maxTouchPoints属性。

function isMobileDevice() {
  if (/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) {
    return true; // 粗略判断
  }

  // 结合触摸事件支持判断
  if ('ontouchstart' in window || navigator.maxTouchPoints > 0 || navigator.msMaxTouchPoints > 0) {
    return true; // 更准确的判断
  }

  return false;
}

console.log("Is Mobile Device:", isMobileDevice());

这种方法先通过userAgent进行初步判断，如果包含常见的移动设备关键词，则认为是移动设备。然后，再通过检查是否支持触摸事件来进一步确认。如果支持触摸事件，则更倾向于认为是移动设备。

为什么navigator.userAgent不可靠？

navigator.userAgent字符串可以被用户修改，这意味着用户可以伪装成任何浏览器或设备。所以，仅仅依赖userAgent来判断设备信息是不准确的。

浏览器厂商也会出于兼容性或其他原因修改userAgent字符串，导致其与实际情况不符。

现代浏览器越来越注重用户隐私保护，可能会限制userAgent字符串的详细程度，甚至对其进行随机化处理。

如何处理不同浏览器之间的兼容性问题？

处理浏览器兼容性问题，是前端开发的永恒主题。对于设备信息获取，可以考虑以下几个方面：

  1. 特性检测： 不要直接假设某个API一定存在，而是先进行特性检测，判断浏览器是否支持该API。例如：

    if ('geolocation' in navigator) {
  // 使用地理位置API
} else {
  // 提供备选方案
}

  2. 使用polyfill或shim： 对于一些较新的API，可以使用polyfill或shim来提供兼容性支持。例如，es5-shim可以为老版本浏览器提供ECMAScript 5的特性支持。

  3. 使用第三方库： 一些第三方库已经封装了各种兼容性处理，可以简化开发工作。例如，Modernizr可以检测浏览器支持的各种特性。

  4. 渐进增强和优雅降级： 采用渐进增强的策略，先保证基本功能在所有浏览器上可用，然后逐步添加更高级的特性。对于不支持这些特性的浏览器，提供优雅的降级方案。

  5. 测试： 在各种浏览器和设备上进行充分的测试，确保应用在不同环境下都能正常工作。

  6. 错误处理： 合理处理可能出现的错误，例如API调用失败、权限被拒绝等。

  7. 使用Typescript： 可以在开发时使用Typescript，它可以在编译阶段发现一些潜在的兼容性问题。

以上就是js怎么获取设备信息的详细内容，更多请关注骃骐网【www.myinqi.com】。

相关推荐：

如何使用Python获取文件夹下的文件数量_通过len与os.listdir

os.listdir()返回指定路径下一级子项（文件和文件夹）的名称列表，故len()统计的是条目总数而非纯文件数；需配合os.path.isfile(os.path.join(path, f))过滤才能准确计数。 os.listdir() 返回的是什么，为什么不能直接用 len() 统计子目录里的文件数 os.listdir() 只返回指定路径下**一级子项的名称列表**（包括文件和文件夹），不...

Python中如何获取当前正在运行的所有异步任务_使用asyncio.all_tasks函数

asyncio.all_tasks 返回当前事件循环中所有未完成的Task对象集合（set），为空常因未启动事件循环、无活跃循环、任务已完结或跨线程未正确设置循环。 asyncio.all_tasks 返回什么，为什么有时为空 asyncio.all_tasks 返回当前事件循环中所有未完成的 Task 对象集合（set），但它**只作用于当前线程中已运行且未关闭的事件循环**。常见误区是直接调用...

Python Textual 教程：正确获取 Input 组件的用户输入值

本文详解如何在 textual 框架中正确访问 input 小部件的实时输入值，避免因生命周期误解、方法签名错误或状态同步不当导致的空值、对象引用异常等问题，并提供可运行的完整示例。 本文详解如何在 textual 框架中正确访问 input 小部件的实时输入值，避免因生命周期误解、方法签名错误或状态同步不当导致的空值、对象引用异常等问题，并提供可运行的完整示例。 在 Textual 应用中，In...

如何在Python中获取DataFrame的前N行与后N行_使用head与tail函数

head和tail是Pandas中安全取前N行与后N行的首选方法，N超限时返回全部行且不报错；它们仅接受整数位置参数n，不支持负数排除语义，链式中惰性执行，groupby后行为特殊。 head 和 tail 是 Pandas 中最直接、最安全的取前 N 行与后 N 行的方式。只要 DataFrame 不为空，它们就一定返回 DataFrame（哪怕 N 超出实际行数），不会报错或意外截断索引。 为...

如何在Python中获取当前的毫秒级时间戳_使用time.time_ns方法

time.time_ns() 返回自 Unix 纪元起的纳秒整数，转毫秒需用 // 1_000_000 截断；它比 time.time() 更精确、无浮点误差，适用于高精度时间戳场景。 time.time_ns() 返回的是纳秒，不是毫秒 直接调用 time.time_ns() 得到的是自 Unix 纪元以来的纳秒数（int 类型），不是毫秒。如果你要毫秒级时间戳（即精确到毫秒的整数，常用于日志、...

为什么Python 3.8及以后版本不推荐使用platform.dist()_迁移至distro第三方库获取系统信息

platform.dist() 在 Python 3.8 中已被彻底移除，调用将触发 AttributeError；因其依赖系统文件、结果不可靠且维护成本高，自 3.5 起弃用，3.8 物理删除；推荐使用 distro 库替代，它专为 Linux 发行版识别设计，支持 Python 3.6–3.12，提供 distro.id() 等清晰接口，但需注意 Alpine 等精简镜像兼容性及全环境部署。 ...

如何获取Python类中所有定义的成员方法_利用dir函数配合inspect模块

用 cls.__dict__ 结合 MRO 过滤可筛出类自身定义的方法：遍历 cls.__dict__ 中的函数、staticmethod、classmethod，再排除在父类 __dict__ 中已存在的同名属性。 如何用 dir() 快速筛出类中定义的方法（而非继承的） dir() 本身不区分定义位置，它返回的是当前命名空间所有可访问属性名（包括从父类继承的、从 __dict__ 注入的、甚至...

如何获取 Emoji 字符的 UTF-8 二进制（或十六进制）字节表示

本文详解在 python 3 中正确获取 emoji 等 unicode 字符 utf-8 编码字节序列的方法，包括长度验证、十六进制展示及二进制转换，并澄清常见误区（如字符串长度 ≠ 字节数）。 本文详解在 python 3 中正确获取 emoji 等 unicode 字符 utf-8 编码字节序列的方法，包括长度验证、十六进制展示及二进制转换，并澄清常见误区（如字符串长度 ≠ 字节数）。 在 ...

如何获取 Emoji 字符的 UTF-8 二进制（及十六进制）表示

本文详解在 Python 3 中正确获取 emoji 等 Unicode 字符 UTF-8 编码字节序列的方法，包括长度验证、十六进制展示和二进制转换，并澄清常见误解（如 len() 返回码点数而非字节数）。 本文详解在 python 3 中正确获取 emoji 等 unicode 字符 utf-8 编码字节序列的方法，包括长度验证、十六进制展示和二进制转换，并澄清常见误解（如 `len()` 返...