当前位置: 首页 > 知识库问答 >
问题:

如何检测设备是否为台式机和/或移动设备,以及是否与AngularJS连接

曹乐意
2023-03-14

我对SO做了一些研究,但类似的问题

我网站的目的是,如果用户在手机(手机或平板电脑)和wifi上,播放视频剪辑;如果用户使用手机而不是wifi,则播放视频片段;如果用户不在手机上,则播放视频剪辑。

不同行为的原因是避免由于视频剪辑的尺寸相对较大而可能给用户带来附加费。这与速度无关 - 如今LTE与wifi的速度差异可能很小;它更多的是担心用户在没有wifi连接的情况下为数据使用付费。

所以我的问题是,使用AngularJS(

(我猜对于 Q1,回退是使用 Bootstrap @media,但这并不理想。

共有3个答案

缪升
2023-03-14

我鼓励开发人员使用功能检测,而不是浏览器或桌面/移动检测。e、 g现代化器具有低带宽连接的功能检测,但并非在所有浏览器中都适用:https://modernizr.com/download#lowbandwidth-集合类

正如它所说,危险在于未知设备被认为速度很快。

为了了解桌面与移动设备,有一种用于收听触摸事件的技术。c.f.:使用JavaScript检测“触摸屏”设备的最佳方法是什么?

关于您是否应该自动播放视频剪辑,如果它是HTML5播放器,它无论如何都不会在移动设备上自动播放,因为您提到的原因,除非它与触摸事件相关联(例如点击播放)。

我已经通过“保存”之前的触摸事件来解决这个问题,比如用视频播放器进入屏幕,然后重新使用该事件来自动播放。尽管如此,请考虑一下自动播放是否真的是你想要的,因为很多用户觉得它很烦人。

微生永春
2023-03-14

至于找出是否使用了什么设备,这个角度插件可以避免一些令人头痛的问题:ngx设备检测器

安装它: $ npm 安装 ngx-设备-检测器 --保存,添加到构造函数。然后调用此名称.设备服务.IsMobile() 例如,检查设备类型是否为移动。它具有用于检查设备是平板电脑还是台式机的其他方法,以及其他返回有关浏览器的有用信息的方法

支华池
2023-03-14

你不需要Angular来做这样的检查。

为了检测设备是桌面设备还是移动设备,请使用导航器.userAgent,请参阅此答案

为了检测连接类型,使用navigator.connection,看这个答案
小心,这个API支持不是通用的,看这里。
另一种方法是尝试这个插件,它依赖于互联网速度检查,但我从未使用过它。
最后,如果你真的需要智能手机用户的这些信息,在科尔多瓦转换你的网站,然后分发你的应用程序。

 类似资料:
  • 问题内容: 我想知道是否有可能检测浏览器是否在iOS上运行,这与使用Modernizr进行功能检测的方式类似(尽管这显然是设备检测而非功能检测)。 通常,我宁愿使用功能检测,但我需要根据该问题确定设备是否为iOS,因为它们处理视频的方式YouTube API无法在iPad / iPhone/非Flash设备上使用 问题答案: 我不喜欢User Agent嗅探,但是这是你的处理方式: 另一种方法是依

  • 我正在为Amazon SNS使用Amazon AWS Ruby SDK,但是我在已经注册的设备上遇到了一些问题。有时,当设备再次注册时,我会收到类似以下错误:AWS::SNS::Errors::InvalidParameter无效参数:令牌原因:endpointarn:AWS:SNS:us-east-1:***已存在,具有相同令牌,但属性不同。。如何检查endpoint是否已经存在,更重要的是,如

  • 第一个问题是它只与Android StudioCanary X一起工作。 Android Studio 4.2 Beta 6 Jetpack Compose是一个预览功能,对Compose的支持仅包含在Android Studio的Canary版本中。要在应用程序项目中使用Compose,请下载并安装IDE的最新Canary版本。 null null null null 错误(发出/KT-4394

  • 我的目标是有一个移动网站(手机和平板电脑)和一个响应桌面网站,建立在Wordpress上。我想最简单的方法来实现傻瓜证明设备检测。 移动网站将会有很多只对触摸设备有益的功能,并将为手机和平板电脑定制设计。桌面网站将完全不同(有相同的页面,但有额外的内容),并将充分响应,以防任何设备逃过检测。 我有一个可以检测触摸设备并重定向到另一个页面的衬里,但它似乎太简单了,不是一个简单的设备检测方法。这是多么

  • 问题内容: 在不使用触摸屏设备的情况下,使用媒体查询最安全的方法是什么?如果无法解决,您是否建议使用JavaScript解决方案,例如Modernizr或Modernizr? 问题答案: 我建议使用modernizr并使用其媒体查询功能。 但是,使用CSS时,存在伪类,例如Firefox。您可以使用:-moz-system-metric(touch- enabled)。但是,并非所有浏览器都提供这

  • 问题内容: 我相信有更好,更合适的方法来做到这一点。但是现在我正在使用UIScreen.main.bounds来检测是否正在处理iPhone X(812高)。顺便说一句,这个特定的应用程序仅适用于风景。这就是我在此功能中要为幻灯片视图创建幻灯片的地方: 但是,如何检查模型? 问题答案: 如果您需要检测设备是否为iPhoneX,请不要使用,这取决于设备的方向。因此,如果用户以纵向模式打开您的应用程序