如何使用 Angular 检测浏览器？

Question

我需要检测浏览器是 IE 还是带有 Angular（TypeScript）的 Edge。可能吗？如果是这样，怎么做？

原文由 Liutas 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

我以前用过这个，效果很好。

 const isIEOrEdge = /msie\s|trident\/|edge\//i.test(window.navigator.userAgent)

原文由 argoo 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

浏览器 userAgent 往往会随着时间的推移而有所不同和发展。与其手动解析 userAgent，不如考虑使用维护良好的库来确保未来的支持。最受欢迎的选项是：

1.UAParser.js

这个优秀的库 将从占用空间相对较小的用户代理数据中分析客户端浏览器、引擎、操作系统、CPU 和设备类型/模型。它得到高度维护并且非常受欢迎（每周 730 万次下载 ATTOW）。使用很简单：

 import { UAParser } from 'ua-parser-js';

const parser = new UAParser();
const result = parser.getResult();

const isEdge = result.browser == 'Edge';

2.角材料

Angular Material V6.4.7 中引入了“平台”检测模块：

平台：通过比较 userAgent 字符串和检查浏览器特定的全局属性来检测当前平台的服务。

关于 EDGE 检测的重要说明： 由于版本 79 EDGE 使用 Blink 浏览器引擎，因此此选项仅适用于旧 EDGE 版本。

导入 Platform 服务并直接检查 EDGE （或任何其他浏览器/操作系统）：

 import { Platform } from '@angular/cdk/platform';

@Injectable()
export class AppService {

    isEdge: boolean;

    constructor(private platform: Platform) {
        this.isEdge = this.platform.EDGE; // or IOS, SAFARI, ANDROID, etc.
    }
}

原文由 Shaya 发布，翻译遵循 CC BY-SA 4.0 许可协议