我想知道是否有可能检测浏览器是否运行在iOS上,类似于你如何使用Modernizr进行功能检测(尽管这显然是设备检测而不是功能检测)。
通常情况下,我会倾向于功能检测,但我需要找出设备是否是iOS,因为他们处理视频的方式根据这个问题,YouTube API不适用于iPad / iPhone /非flash设备
我想知道是否有可能检测浏览器是否运行在iOS上,类似于你如何使用Modernizr进行功能检测(尽管这显然是设备检测而不是功能检测)。
通常情况下,我会倾向于功能检测,但我需要找出设备是否是iOS,因为他们处理视频的方式根据这个问题,YouTube API不适用于iPad / iPhone /非flash设备
当前回答
因为导航器。平台已弃用,最好不再使用,我想添加一个其他解决方案。
你可以通过检查navigator.vendor来过滤MacOS系统。 当结果是苹果电脑公司,你知道它是MacOS。
其他回答
如果您正在使用Modernizr,您可以为它添加一个自定义测试。
决定使用哪种检测模式并不重要(userAgent, navigator。Vendor或navigator.platform),您总是可以将其打包以便稍后使用。
//Add Modernizr test
Modernizr.addTest('isios', function() {
return navigator.userAgent.match(/(iPad|iPhone|iPod)/g);
});
//usage
if (Modernizr.isios) {
//this adds ios class to body
Modernizr.prefixed('ios');
} else {
//this adds notios class to body
Modernizr.prefixed('notios');
}
如果你还在尝试检查是否是iOS,我建议你使用以下方法:
创建一个名为helper的文件夹 创建一个名为platform的文件。Ts或platform.js 导出函数isIOS:
export const isIOS = () => {
let platform = navigator?.userAgent || navigator?.platform || 'unknown'
return /iPhone|iPod|iPad/.test(platform)
}
如果是iPhone或iPod或Ipad,结果为真,否则为假。
你可能会问,为什么我需要检查导航器。userAgent || navigator。平台,原因很简单,第二个选项曾经是默认选项,但现在它已弃用,一些浏览器将在未来停止支持它,第一个选项更可靠。
你可以在这里查看我上面提到的反对意见:
https://developer.mozilla.org/en-US/docs/Web/API/Navigator/platform: ~:文本3 =弃用% % 20这% % 20 20特性是% 20不,% 20保持% 20 % 20兼容性% 20目的。
记录userAgentData、userAgent和平台。
使用下面的函数,我收到了这些日志:
console.log({
userAgentData: navigator?.userAgentData?.platform,
userAgent: navigator?.userAgent,
platform: navigator?.platform,
})
{
"userAgentData": "",
"userAgent": "Mozilla/5.0 (iPhone; CPU iPhone OS 13_2_3 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.0.3 Mobile/15E148 Safari/604.1",
"platform": "MacIntel"
}
我在自己的Macbook电脑上测试了它,它在不同的浏览器和操作系统上都能运行。你可以看到navigator?。useragentdata ?。平台根本不起作用。
我也没有收到任何与我的typescript相关的错误,即使我使用React调用这个函数。
奖金、isAndroid
如果你想知道如何检查是否是Android平台,我建议你不要遵循与isIOS相反的想法:
const isAndroid = !isIOS();
原因很简单,因为桌面将被视为Android平台,所以它将无法工作。 要解决这个问题,你只需要做以下检查:
export const isAndroid = () => {
const ua = navigator.userAgent.toLowerCase() + navigator?.platform.toLowerCase();
const isAndroid = ua.indexOf("android") > -1;
return isAndroid;
}
我们检查导航器的原因。userAgent + navigator?平台支持新旧浏览器。
为了检测iOS版本,我们必须像这样用Javascript代码解构用户代理:
var res = navigator.userAgent.match(/; CPU.*OS (\d_\d)/);
if(res) {
var strVer = res[res.length-1];
strVer = strVer.replace("_", ".");
version = strVer * 1;
}
可能值得回答的是,运行iOS 13的ipad将有导航器。平台设置为MacIntel,这意味着你需要找到另一种方法来检测iPadOS设备。
这将变量_iOSDevice设置为true或false
_iOSDevice = !!navigator.platform.match(/iPhone|iPod|iPad/);