閲覧者のOSやブラウザを取得する必要があったので
汎用的なユーティリティを作成しました。

OSを取得する

ユーティリティ関数

Utills.js
export const getOS = () => {
  const userAgent = navigator.userAgent.toLowerCase();

  if(userAgent.indexOf("windows nt") !== -1) {
    return "Microsoft Windows";
  } else if(userAgent.indexOf("android") !== -1) {
    return "Android";
  } else if(userAgent.indexOf("iphone") !== -1 || userAgent.indexOf("ipad") !== -1) {
    return "iOS";
  } else if(userAgent.indexOf("mac os x") !== -1) {
    return "macOS";
  } else {
    return "Unknown";
  }
}

使い方

main.js
import { getOS } from 'Utills.js;
console.log(getOS);
// macOS

ブラウザ名を取得する

ユーティリティ関数

Utills.js
export const getBrowser = () => {
  const userAgent = navigator.userAgent.toLowerCase();

  if(userAgent.indexOf("edge") !== -1 || userAgent.indexOf("edga") !== -1 || userAgent.indexOf("edgios") !== -1) {
    return "Microsoft Edge";
  } else if (userAgent.indexOf("opera") !== -1 || userAgent.indexOf("opr") !== -1) {
    return "Opera";
  } else if (userAgent.indexOf("samsungbrowser") !== -1) {
    return "Samsung Internet Browser";
  } else if (userAgent.indexOf("ucbrowser") !== -1) {
    return "UC Browser";
  } else if(userAgent.indexOf("chrome") !== -1 || userAgent.indexOf("crios") !== -1) {
    return "Google Chrome";
  } else if(userAgent.indexOf("firefox") !== -1 || userAgent.indexOf("fxios") !== -1) {
    return "Mozilla Firefox";
  } else if(userAgent.indexOf("safari") !== -1) {
    return "Safari";
  } else if (userAgent.indexOf("msie") !== -1 || userAgent.indexOf("trident") !== -1) {
    return "Internet Explorer";
  } else {
    return "Unknown";
  }
}

使い方

main.js
import { getBrowser } from 'Utills.js;
console.log(getBrowser);
// Google Chrome