---
description: b 站投稿页右上角有一个下载投稿工具的按钮，但当点开这个按钮时，发现是.exe文件，目前我的电脑使用的是macos系统。
tags:
  - userAgent
slug: the-web-side-determines-what-system-it-is-so-that-the-different-components-are-displayed
title: 网页端判断是什么系统，从而显示不同的组件。
date: 2024-12-17
author: KazooTTT
type: Post
status: Published
finished: true
published: true
category: 
toAstro: true
date_created: 2025-01-04T11:44:53+08:00
date_modified: 2025-01-22T13:39:19+08:00
---

看到 b 站投稿页的右上角有一个下载投稿工具的按钮。

![image.png](https://pictures.kazoottt.top/2024/12/20241211-20241211213004.png)

点了之后发现是.exe 文件，而我的电脑是 macos 的系统。所以这次的下载算是无效操作。

![image.png](https://pictures.kazoottt.top/2024/12/20241211-20241211211526.png)

体验要做的更好一点的话，应该根据系统来显示不同的组件。（在这里如果不是 windows，就不要显示 exe 相关的文件夹下载）

``` js
function getOperatingSystem() {
  const userAgent = navigator.userAgent || navigator.vendor || window.opera;

  if (/windows/i.test(userAgent)) {
    return "Windows";
  } else if (/macintosh|mac os x/i.test(userAgent)) {
    return "macOS";
  } else if (/linux/i.test(userAgent)) {
    return "Linux";
  } else if (/android/i.test(userAgent)) {
    return "Android";
  } else if (/iphone|ipad|/i.test(userAgent)) {
    return "iOS";
  } else {
    return "Unknown";
  }
}
```

userAgent 的例子：

> 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/131.0.0.0 Safari/537.36'

## 参考

[User-Agent - HTTP \| MDN](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/User-Agent)

[What are the latest user agents for popular web browsers?](https://www.whatismybrowser.com/guides/the-latest-user-agent/)