UAParser is an open source library for parsing the browser user agent. It’s a lightweight and easy to use library with a minified file size of ~11KB; as the library name says, the primary purpose of UAParser is to parse the user agent and get the relevant information about the browser, engine, operating system, device and CPU architecture.
Please find the library located at Github: UAParser.js
Below are the results of the parsed user agent information. The below information is based on readme.md of ua-parser library.
- {
- ua: "",
- browser:
- {
- name: "",
- version: ""
- },
- engine:
- {
- name: "",
- version: ""
- },
- os:
- {
- name: "",
- version: ""
- },
- device:
- {
- model: "",
- type: "",
- vendor: ""
- },
- cpu:
- {
- architecture: ""
- }
- }
Download and include the script in your HTML webpage and start using it to parse the user agent.
- <script type="text/javascript" src="ua-parser.min.js">
- </script>
Below is the code snippet for creating a UAParser. By default, the parser makes use of window.navigator.userAgent as the user agent to get the parsed results. However, there is an option to explicitly set the user agent and parse the same.
- var parser = new UAParser();
- var browserInfo = parser.getResult();
Below is the variation of the usage of UAParser
- console.log(parser.getOS().name);
- console.log(parser.getOS().version);
- console.log(parser.getEngine());
- console.log(parser.getBrowser().name);
- console.log(parser.getBrowser().version);
Here’s the demo code sample illustrating the usage of UAParser. The below code sample is based on ua-parser library readme.md.
- <!doctype html>
- <html>
- <head>
- <script type="text/javascript" src="ua-parser.min.js">
- </script>
- <script type="text/javascript">
- var parser = new UAParser();
- var result = parser.getResult();
- console.log(result.browser);
- console.log(result.device);
- console.log(result.os.name);
- console.log(result.os.version);
- console.log(result.engine.name);
- console.log(result.cpu.architecture);
- </script>
- </head>
- <body>
- <h1>Please right click and select the Inspect Element -> Console option to view the user agent results</h1>
- </body>
- </html>