如何以正确的方式检测 Android 设备？

Posted 2023-02-25

【中文标题】如何以正确的方式检测 Android 设备？

【英文标题】：How to detect an Android device the right way?

【发布时间】：2015-09-21 14:27:42

【问题描述】：

我有一个问题，我需要检测网页是否在 android 浏览器上运行。用例是需要根据虚拟键盘的存在来调整页面。

我需要知道用户是否在 Android 设备上的原因是，在 Android 上，与 ios 设备不同，视口高度设置会因键盘的存在而被修改，以反映可见的剩余空间。在 iOS 设备上，您必须根据了解（关于）虚拟键盘在屏幕上占用多少空间来进行有根据的猜测。

所以我需要能够知道如何计算视口高度，因为不幸的是，对于这些不同的操作系统上下文，它是不同的。有没有人对如何做到这一点有任何想法？我知道浏览器嗅探是不可取的，那么在这种情况下该怎么办？任何人的想法？我是不是误会了什么？

【问题讨论】：

你是在写html，还是css，还是什么？我让我的 Apache Web 服务器检测设备的类型，然后重写 url 以将用户引导到不同的页面。我想这不是你想要的。

不，这是在客户端。当虚拟键盘打开时，页面需要对其布局进行一些调整。这有点乱。根本问题是无法知道虚拟键盘已用完的空间量，并且虚拟键盘打开的后果因浏览器和设备而异。一团糟。顺便说一句，在服务器上进行浏览器嗅探不是一个坏主意吗？

通过@media query 使用响应式布局。媒体查询允许您根据屏幕统计信息（如高度/宽度）进行布局自定义

【参考方案1】：

So I need to be able to know how to calculate the viewport height because it's different

并非如此，您可以使用 media query system 自定义布局以适应任​​何浏览器（您知道，除了 I.E.）。

I know that browser sniffing is not advisable

还取决于您的应用程序。如果您知道一个不安全的浏览器（您知道，IE），您可能不想响应该请求。

so what is one to do in a case like this? Ideas anyone? Have I misunderstood something?

显然你没有误解任何东西。但是，还有更多资源和指南可以帮助您解决问题。 您可以使用onResize 函数解决您的问题，并自己处理更改，使用查询来修复布局（我更喜欢使用基于百分比的宽度/高度更改），甚至有单独的页面，并使用用户代理来更改页面结果

【讨论】：

很遗憾，在这种情况下，媒体查询将不起作用。

@fraxture 你能告诉我为什么不呢？您没有使用 WebView 吗？如果是这样，那么媒体查询应该可以工作（它在我的测试设备上，索尼、三星和摩托罗拉）......另外，onResize DOM 函数呢，它没有按预期执行吗？