Skip to content

Instantly share code, notes, and snippets.

@dezashibi

dezashibi/detect_client_operating_system.html

Created February 24, 2024 05:59
Show Gist options
  • Save dezashibi/e80aa2cd07801f94f1f806dc580ea90e to your computer and use it in GitHub Desktop.
Save dezashibi/e80aa2cd07801f94f1f806dc580ea90e to your computer and use it in GitHub Desktop.
Download ZIP
How to detect client operating system in javascript, Got from: https://tecadmin.net/demo/javascript-detect-os.html
Raw
detect_client_operating_system.html
<!DOCTYPE html>
<html>
<head>
<title>OS Detection</title>
<style>
body {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: 100vh;
margin: 0;
background-color: #f0f0f0;
font-family: Arial, sans-serif;
}
button {
padding: 10px 20px;
margin-top: 20px;
font-size: 16px;
}
</style>
</head>
<body>
<h1>Operating System Detection</h1>
<p id="osLabel">Click the button to detect your OS</p>
<button onclick="detectOS()">Detect OS</button>
<script>
function detectOS() {
let userAgent = window.navigator.userAgent,
platform = window.navigator.platform,
macosPlatforms = ['Macintosh', 'MacIntel', 'MacPPC', 'Mac68K'],
windowsPlatforms = ['Win32', 'Win64', 'Windows', 'WinCE'],
iosPlatforms = ['iPhone', 'iPad', 'iPod'],
os = null;
if (macosPlatforms.indexOf(platform) !== -1) {
os = 'Mac OS';
} else if (iosPlatforms.indexOf(platform) !== -1) {
os = 'iOS';
} else if (windowsPlatforms.indexOf(platform) !== -1) {
os = 'Windows';
} else if (/Android/.test(userAgent)) {
os = 'Android';
} else if (!os && /Linux/.test(platform)) {
os = 'Linux';
}
document.getElementById('osLabel').innerText = "You are using " + (os ? os : "an unknown OS");
}
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment