Какой самый быстрый метод для обнаружения User-Agent как metro Версия пользовательского интерфейса internet-explorer >=10?
Определить версию UI Metro UI
Ответ 1
Итак, похоже, что не существует окончательного теста для идентификации Metro IE vs Desktop IE, но, похоже, есть несколько разных частей данных, которые вы можете попытаться использовать, чтобы предположить, что это Metro. К сожалению, ни один из элементов, которые я нашел, не может быть объяснен другими настройками. Другими словами, для всех "функциональных" тестов, которые я нашел, Desktop IE можно настроить таким образом, чтобы обманывать тесты, думая, что он работает на Metro.
Отключен ли ActiveX (Metro не разрешает никакого активного содержимого, но IE рабочего стола также может отключить его):
function isActivexEnabled() {
var supported = null;
try {
supported = !!new ActiveXObject("htmlfile");
} catch (e) {
supported = false;
}
return supported;
}
Проверка строки User Agent (Metro всегда будет работать в режиме 64 бит, но не будет на 32-битной машине, а Desktop IE может быть настроен для работы в режиме 64 бит, а также не уверен, насколько популярна любая из этих опций)
function isWin64() {
return navigator.platform == "Win64";
}
Полноэкранная проверка (Metro всегда будет в полноэкранном режиме, однако Desktop IE также может работать в полноэкранном режиме, но это можно использовать как подтверждающее свидетельство режима Metro)
function isFullScreen() {
return (window.innerWidth == screen.width &&
window.innerHeight == screen.height);
}
Короче говоря, я думаю, вам нужно попытаться проверить кучу функций, а потом догадаться, нет окончательного способа. Или вы можете просто согласиться с тем, что MS не хочет, чтобы вы это делали, и используйте функцию обнаружения функций, которые вы хотите использовать.
Для тех, кто хочет попытаться предоставить интерфейс, чтобы ссылаться на содержащий пользовательский интерфейс браузера (например, указать, как подключить веб-страницу), имейте в виду, что другие приложения Metro могут встроить браузер IE10 Metro в качестве элемента управления, поэтому даже если вы можете идентифицировать браузер как Metro vs desktop, пользовательский интерфейс может быть не там, где вы пытаетесь его сослаться, так что это может оказаться довольно сложной ситуацией, чтобы получить право в 100% случаев. Поэтому либо не пытайтесь, либо вы можете попробовать другие методы обнаружения и принять, что есть примеры использования, которые могут отображаться с неправильным интерфейсом.
Ответ 2
Я не верю, что есть способ определить, поступает ли запрос от версии Metro версии IE10 по сравнению с обычной версией режима рабочего стола. У Metro IE нет уникальных заголовков HTTP или строки пользовательского агента, чтобы идентифицировать их.
Строки User Agent 10 для Windows 8 64bit
Metro IE10 - это 64-битное приложение, поэтому в строке user-agent вы увидите "Win64". Обычный рабочий стол IE10 по умолчанию 32-битный и будет показывать "WOW64". Вы могли бы рассказать об этом, но вы ошибочно определяете всех, кто решил запустить 64-разрядную версию IE10 в рабочем режиме. Как видно из этой диаграммы, строки пользовательского агента идентичны. [edit: как отмечено в комментариях, это не будет работать для 32-разрядных ПК.]
Я мог понять, почему вы можете обнаружить Metro IE, но этот тип "обнюхивания браузером" обычно обескуражен, потому что он настолько громоздкий и подвержен ошибкам. Лучше всего использовать тестер для определенных функций браузера, которые вам потребуются, например, Modernizr.
Ответ 3
Спасибо, Джон Раджакумар и Алексис Пиджон. Я смог использовать ваш Metro IE check в качестве основы для загрузки отдельной таблицы стилей CSS для таблиц Metro (MS Surface). Чтобы добавить немного больше уверенности в своем уме, я использовал cssuseragent, чтобы сначала определить IE10, а затем объединить оба теста в последнем yepnope.
var IEmetrotest = ((cssua.userAgent.ie > 9) && (metrotest()));
yepnope({
test: IEmetrotest,
yep : ['ie_metro.css']
});
Протестировано в браузере и работает как ожидалось. (Я бы поставил вас на галочку, но пока у вас недостаточно очков.)
// Minor revisions to isBrowserSupportPlugin() previously posted
// Renamed function to metrotest() and inverted the returned value.
var errorName = null;
function metrotest() {
var supported = null;
try {
new ActiveXObject("");
}
catch (e) {
// FF has ReferenceError here
errorName = e.name;
}
try {
supported = !!new ActiveXObject("htmlfile");
} catch (e) {
supported = false;
}
if(errorName != 'ReferenceError' && supported==false){
supported = false;
}else{
supported =true;
}
return !supported;
}
Ответ 4
METRO IE никогда не поддерживает ActiveX или любые объекты плагина. Исходя из этого, проверяется и работает нормально script.
//---------------------------Metro IE check-------------------------
var errorName = null;
function isBrowserSupportPlugin() {
var supported = null;
try {
new ActiveXObject("");
}
catch (e) {
// FF has ReferenceError here
errorName = e.name;
}
try {
supported = !!new ActiveXObject("htmlfile");
} catch (e) {
supported = false;
}
if(errorName != 'ReferenceError' && supported==false){
supported = false;
}else{
supported =true;
}
return supported;
}
//----------------------------------------------------------------
Ответ 5
Надежное современное/метрологическое обнаружение!
Я нашел способ обнаружить Modern versus Desktop, который вы можете попробовать здесь: http://jsbin.com/genac/2 (редактировать с помощью Chrome или Firefox не IE http://jsbin.com/genac/2/edit).
Кажется, это довольно надежное обнаружение, потому что:
- он работает даже при масштабировании
- он работает, даже если два окна щелкнули рядом с Modern (Metro)
- он работает, даже если страница масштабируется с помощью ctrl- + и ctrl -
- он работает, даже если рабочий стол полноэкранный, с помощью клавиши F11 на рабочем столе (панель автосохранения)
Фокус в том, что полосы прокрутки страницы на Modern не делают размер окна клиента меньше (они появляются над страницей), но полосы прокрутки страницы на рабочем столе влияют на размер окна клиента (размер используемого окна меньше).
Основной недостаток заключается в том, что для проверки требуется, чтобы у вас была полоса прокрутки на странице, чтобы обнюхать разницу. Одинаковая разница в полосах прокрутки происходит в iframe или autoscrollable div?
Изменить: я бы проверить, что браузер IE11 перед использованием этого кода, потому что Windows 10 не имеет Metro/Modern и Edge действует несколько иначе.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=EDGE" />
<title>Metro width detector - robocat</title>
<script>
function show() {
var div = document.createElement('div');
var s = [];
s.push('IS METRO? ' + ((tester.offsetWidth == window.outerWidth) ? 'YES' : 'NO'));
s.push('document.documentElement.clientWidth: ' + document.documentElement.clientWidth);
s.push('document.documentElement.offsetWidth: ' + document.documentElement.offsetWidth);
s.push('window.innerWidth: ' + window.innerWidth);
s.push('window.outerWidth: ' + window.outerWidth);
s.push('screen.width: ' + screen.width);
s.push('screen.availWidth: ' + screen.availWidth);
s.push('document.documentElement.getBoundingClientRect().width: ' + document.documentElement.getBoundingClientRect().width);
s.push('tester.offsetWidth: ' + tester.offsetWidth);
div.innerHTML = s.join('<br>');
document.body.insertBefore(div, document.body.firstChild);
}
window.onresize = function() {
show();
}
</script>
</head>
<body onload="show()" style="margin:0">
<div id="tester" style="position:absolute;left:0;right:0;"></div>
<div style="height:10000px;width:10px;background-color:blue;"></div>
</body>
</html>
Вы можете посмотреть размеры страницы/окна, используя: http://jsbin.com/AbimiQup/10 (редактировать с помощью Chrome или Firefox не IE http://jsbin.com/AbimiQup/10/edit)
PS: Возможно, есть какой-то способ понюхать отличие полосы прокрутки от runtimeStyle для body или document.documentElement, потому что возможно -ms-overflow-style: используется -ms-authiding-scrollbar (например, document.documentElement.runtimeStyle.msOverflowStyle), но я ничего не мог найти.
PPS: метод ActiveX, указанный в других ответах, не является особенно надежным (например, пользователи могут отключить), и это вызывает уродство UI, поскольку в IE11 он показывает значок "ActiveX" рядом с URL-адресом.
Ответ 6
Вот последовательный метод, не зависящий от проверки ActiveX, как проверено в IE10 и IE11 специально.
if (window.screenY === 0 && (window.innerHeight+1) !== window.outerHeight){ //IE metro/modern UI }
Первое правило определяет полный экран IE или современный вид (который может или может быть правдой на IEMobile). Максимизированный режим исторически всегда связан с положительным или отрицательным screenX и screenY.
И последнее правило исключает режим [Full screen/F11], который по какой-то причине постоянно показывает расхождение в 1px между outerHeight и innerHeight как проверено на IE10/Win8 и IE11/Win8.1
PS: Я добровольно не объявляю window.screenX === 0. Используйте screenY только для оснащения Modern/Metro в режиме привязки с контекстом окна, помеченным справа (то есть screenX! == 0).
Ответ 7
Я протестировал следующие и он работает, показанную здесь jsfiddle можно найти здесь.
Это немного длинный снимок, но кажется довольно разумным решением:
Почему бы не проверить, включен ли браузер в полноэкранном режиме 1 и в зависимости от этого вызова полноэкранный один метро. У меня Windows 8 работает на моем компьютере на работе, поэтому я постараюсь проверить завтра, есть ли еще какой-либо графический интерфейс (не думаю, что я его помню), и если это так, вам придется вручную вычитать их. Правда, это не самое красивое решение, но насколько я знаю, не будет никакого "красивого" решения, и это может оказаться довольно солидным взломом, поскольку графический интерфейс IE IE не может быть изменен с помощью каких-либо панелей инструментов или аналогичного программного обеспечения (насколько я знаю). Правда, это может привести к ошибочной идентификации IE рабочего стола, но даже это в разумных пределах, поскольку IE в полноэкранном рабочем столе все равно даст аналогичный опыт.
1 Предоставляя что-то по строкам:
if(window.innerWidth == screen.width && window.innerHeight == screen.height) {
// metro
} else {
// desktop
}
Ответ 8
По звукам вы пытаетесь сделать что-то по строкам Pinning сайта на начальный экран в Metro. Для этого вы можете проверить, может ли сайт быть привязан, используя этот код, который был введен с IE9, и может быть сделано, выполняя что-то вроде этого...
function doChecks_Browser() {
// full pin abilities == can pin && Win7+
if (pinnedSiteDetection.hasFullPinAbilityBrowser)
}
Подробнее об этом здесь.
Из этого этот пост на MSDN...
Предварительный просмотр версии Windows 8 реализует закрепленные сайты, используя фрагменты на экране "Пуск". Когда пользователь нажимает на плитку закрепленного сайта, сайт открывается в Windows Internet Explorer 10 Release Preview в среде пользовательского интерфейса в стиле Metro Metro.
Надеюсь, что это поможет!
Ответ 9
Он пробовал код ниже и, похоже, работает.
Это не поймает, если пользователь по-прежнему использует InternetOptions- > CustomLevel- > ScriptActivexControlsMarkedSafeForScripting = false. Если пользователь делает это, код считает, что это Metro/Modern.
В настоящее время я не вижу этого, проверяя ОС, FullScreen и многое другое.
isWinModern проверяет Metro/Modern.
isWinDesktop проверяет Windows как Desktop (= в этом случае несовременно)
Не гарантируется выполнение приведенного ниже кода.
function isWin8Modern() {
if (!!window.ActiveXObject) {
try {
!!new window.ActiveXObject('htmlfile');
return false;
} catch (exc) {
return true;
}
} else {
return false;
}
}
function isWinDesktop() {
if (window.ActiveXObject) {
try {
new window.ActiveXObject('htmlfile');
return true;
} catch (exc) {
return false;
}
} else {
return false;
}
}
Ответ 10
var _ua = window.navigator.userAgent;
var isIDevice = (/iphone|ipod|ipad/i).test(_ua);
var isMobileChrome = (_ua.indexOf('Android') > -1 && (/Chrome\/[.0-9]*/).test(_ua) && _ua.indexOf("Version") == -1);
var isMobileIE = _ua.indexOf('Windows Phone') > -1;
function isActivexEnabled()
{
var supported = null;
try
{
supported = !!new ActiveXObject("htmlfile");
}
catch (e)
{
supported = false;
}
return supported;
}
if (!isIDevice && !isMobileChrome && !isMobileIE && _ua.toLowerCase().indexOf("wow") == -1 && !isActivexEnabled())
{
//IE Metro UI
}
Эта работа для меня..
Ответ 11
Я потратил некоторое время на это и понял путь. Я думал о том, чего не хватает в IE10 Metro, и только одна вещь, которая задокументирована, не поддерживается в интерфейсе Metro. Инструменты разработчика. Ну, эти инструменты имеют объекты в объекте окна. Один из них - "__IE_DEVTOOLBAR_CONSOLE_COMMAND_LINE".
Если вы делаете что-то вроде
if (window.__IE_DEVTOOLBAR_CONSOLE_COMMAND_LINE)
{
// In IE 10 Standard UI
}
else
{
// In IE 10 Metro UI
}
Я тестировал его в нескольких разных средах и, похоже, работал в большинстве мест. Единственный икота, о которой я могу думать, - это то, что инструменты разработчика были как-то отключены в пользовательском браузере.