Agentv2.4.4

Extracts browser and operating system information from the user agent string or user agent object(userAgentData).
#user-agent-parser #browser-detection #client-hints

Getting Started / Demos / Documentation / Source

Getting Started

Supported Browsers

The following are the supported browsers.

  • Internet Explorer: 7+
  • Chromium (Chrome, Edge, Whale): latest
  • Firefox: latest
  • Safari: latest
  • iOS: 3+
  • Android: 2.1+

Client Hints Support

  • Chromium (Chrome, Edge, Whale): 84+ (Experimental)
  • Gecko (Firefox): Unknown
  • Webkit (Safari): Unknown

Quick steps to use:

Load files or import library


<script src="//naver.github.io/egjs-agent/release/latest/dist/agent.min.js"></script>


$ npm i @egjs/agent

Use

import getAgent from "@egjs/agent";

// getAgent(eg.agent) will use browser's navigator.userAgentData or navigator.userAgent
var agentInfo = getAgent(); // or eg.agent();

// or you can use own user-agent string
agentInfo = getAgent(ua);

console.log(agentInfo);
/*
    {
        browser: {
            name: "string",
            version: "number",
            majorVersion: number,
            webview: true or false,
            webkit: true or false,
            chromium: true or false,
        },
        os: {
            name: "string",
            version: "number",
            majorVersion: number,
        },
        isHints: ture or false,
    }
*/

get accurate agent information.

  • Prepare the Client Hints.
  • Your agent information becomes uncertain.
  • Use getAccurateAgent(eg.agent.getAccurateAgent) instead of getAgent(eg.agent)
import { getAccurateAgent } from "@egjs/agent";

// Use Promise
// eg.agent.getAccurateAgent
getAccurateAgent().then(agent => {
    // Check OS, OS version
    agent.os.name
    agent.os.version

    // Check Browser full verion
    agent.browser.version
});

// Use Callback
getAccurateAgent(agent => {});

Demos

Target User Agent

(Copy and paste the user agent string to parse)

Result

OS

name:
version:
majorVersion:

Browser

name:
version:
majorVersion:

webview:

webkit:
chromium:

isMobile

isHints

var uaInput = document.querySelector(".useragent-input");
uaInput.addEventListener("input", function() {
    var agentInfo = eg.agent();

    osName.innerHTML = agentInfo.os.name;
    osVersion.innerHTML = agentInfo.os.version;
    osMajorVersion.innerHTML = agentInfo.os.majorVersion;

    browserName.innerHTML = agentInfo.browser.name;
    browserVersion.innerHTML = agentInfo.browser.version;
    browserMajorVersion.innerHTML = agentInfo.browser.majorVersion;
    
    browserWebview.innerHTML = agentInfo.browser.webview;
    browserWebkit.innerHTML = agentInfo.browser.webkit;
    browserChromium.innerHTML = agentInfo.browser.chromium;

    isHints.innerHTML = agentInfo.isHints;
    isMobile.innerHTML = agentInfo.isMobile;
})