1. 简介
ua-device-detector 是一个基于 User-Agent 字符串识别设备类型和操作系统的 npm 包，支持在前端和后端使用。它可以识别用户设备的类型（手机、平板、PC等）和操作系统（Windows、iOS、Android等），帮助开发人员更好地处理不同设备的展示和交互。
2. 安装
在使用 ua-device-detector 之前，需要先安装它：
npm install ua-device-detector
3. 使用
### 3.1 在浏览器中使用
在浏览器中，可以使用 cdn 引入 ua-device-detector：
<script src="https://cdn.jsdelivr.net/npm/ua-device-detector/build/ua-device-detector.js"></script>
然后就可以在代码中使用 UADeviceDetector 的实例（以下示例代码均在浏览器环境下运行）：
const detector = new UADeviceDetector(window.navigator.userAgent); console.log(detector.device()); // 手机、平板、PC等 console.log(detector.os()); // Windows、iOS、Android等 console.log(detector.browser()); // Chrome、Safari、Firefox等
3.2 在 Node.js 中使用
在 Node.js 中，可以直接 require 引入 ua-device-detector：
const UADeviceDetector = require('ua-device-detector');
const detector = new UADeviceDetector(req.headers['user-agent']);
console.log(detector.device());
console.log(detector.os());
console.log(detector.browser());4. API
constructor(userAgent: string)创建 UADeviceDetector 实例，需要传入 User-Agent 字符串。device(): string返回设备类型，包括手机、平板、PC等。os(): string返回操作系统，包括 Windows、iOS、Android等。browser(): string返回浏览器类型，包括 Chrome、Safari、Firefox等。
5. 示例
-- -------------------- ---- -------
--------- -----
----- -------------
------
----- ----------------
------------------------- ----------
------- -------------------------------------------------------------------------------------------
--------
----- -------- - --- ---------------------------------------------
------------------------------------------- - ------------------
--------------------------------------- - --------------
-------------------------------------------- - -------------------
---------
-------
------
-------------
----
--------- ----- ------------------------
--------- ----- --------------------
---------- ----- -------------------------
-----
-------
-------6. 指导意义
ua-device-detector 让我们可以更好地处理不同设备的展示和交互，提升用户体验。例如，在移动设备上，我们可以根据设备类型，选择不同的布局和交互方式；在不同操作系统上，我们可以优化特定操作系统的功能和交互。使用 ua-device-detector，可以让我们更加智能地处理这些问题，提高我们的开发效率。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/5eedcb02b5cbfe1ea0612523