Есть ли способ узнать, сможет ли конечный пользователь обрабатывать ссылки <a href= "https://stackoverflow.com/tel:###" rel="nofollow noreferrer" >?
Итак, если вы хотите установить ссылку на номер телефона, вы бы сделали что-то вроде
<a href="tel:18005555555">Click to Call</a>
Это обычно используется на мобильных сайтах и набирает обороты на настольных сайтах (в основном благодаря Skype, я думаю.) Однако некоторые компьютеры/устройства не могут его поддерживать. Есть ли способ узнать, может ли пользователь работать с tel: links?
Решение может быть как на стороне сервера, так и на стороне клиента, но я бы предположил, что он должен быть на стороне клиента.
Ответы
Ответ 1
DeviceAtlas и Wurfl можно получить вы некоторые из этой информации, но, как многие из них указали, на самом деле нет действительно надежного способа обнаружения способности устройств совершать звонки. В конце концов, кто-то может быть на рабочем столе, но способен совершать звонок от него на основе программного обеспечения, которое они установили (или даже возможностей ОС).
В интересах обеспечения наилучшего опыта вы должны включить ссылки tel:
. Это даст каждому возможность набрать номер, если он сможет с ним справиться. Вы можете использовать CSS, чтобы он выглядел менее похожим на ссылку, чтобы уменьшить потенциальную путаницу для поддерживающих браузеров/ОС без поддержки tel:
. Пользователи, которые хотят позвонить по номеру, будут выбирать его или прикоснуться к нему в любом случае (в надежде на копирование номера) и либо активируют ссылку (в сценариях), либо видят руку (в сценариях мышей), помогая им быстрее достичь своей цели.
Как немного в стороне, установка ссылок white-space: nowrap
на tel:
также всегда является хорошей идеей:-) Это будет содержать номера на одной строке, чтобы дефис не позволял ей сломаться.
a[href^=tel:] { white-space: nowrap; }
Ответ 2
Просто мысль, но если вы введете информацию заголовка ниже
<meta name="format-detection" content="telephone=yes">
Вы сможете ввести номера телефонов без префикса tel: (или даже привязки), и браузер автоматически преобразует их в интерактивные телефонные ссылки.
Я думаю, что это может быть более надежным, чем обнаружение функций или агентов.
Ответ 3
Насколько я могу судить, не кажется, что это хороший надежный способ сделать это. Это зависит от того, какое программное обеспечение установлено помимо браузера, и поэтому я не думаю, что оно будет отображаться на веб-странице (в противном случае вы можете использовать его для проверки того, установлено ли у пользователя определенное программное обеспечение, особенно с конкретными приложениями, такими как itunes или visual студия).
EDIT: Как указано в комментариях, firefox пытается переместиться и вместо этого отобразит страницу с ошибкой, показанное ниже решение не будет работать для firefox.
Альтернативой этому является просто обращение к кому-то нажав на него, и он не работает прилично. Тестирование с помощью хром кажется, что браузер просто ничего не делает, если протокол не распознается, поэтому вы можете просто добавить onclick, который принимает часть после tel:
и преобразует click to call
в фактическое число. Таким образом, нажатие на него показывает номер, если у них ничего не установлено, что, возможно, является достойным компромиссом?
Ответ 4
Насколько я знаю, какие возможности/приложения у пользователя могут быть сложными по соображениям безопасности, но вы можете управлять некоторыми вещами и идти оттуда.
Вы можете попытаться просмотреть его мобильный браузер, который может обрабатывать ссылку, а затем, если нет, посмотрите, может ли другое устройство использовать номер телефона, например. Skype, а если нет, просто покажите нормальное число.
это объединяет ответы на эти вопросы href tel и стандартные браузеры и Javascript для обнаружения Skype?
<div>
<?php if(strstr(strtolower($_SERVER['HTTP_USER_AGENT']), 'mobile') || strstr(strtolower($_SERVER['HTTP_USER_AGENT']), 'android')) { echo '<div id="tel"><a href="tel:123456">123456</a></div>'; }else{?>
<script>
function skype (failureFunction) {
var $ = jQuery;
if ($.browser.safari || $.browser.opera) {
return true;
} else if ($.browser.msie) {
try {
if (new ActiveXObject("Skype.Detection")) return true;
} catch(e) { }
} else {
if (typeof(navigator.mimeTypes["application/x-skype"]) == "object") {
return true;
}
}
$('a[href^="skype:"]').click(function() {
failureFunction();
return false;
});
return false;
}
jQuery(function($) {
if (skype()) {
$('div#tel').html("<a href='skype:123456'>123456</a>");
} else {
$('div#tel').html("<p>123456</p>");
};
});
</script>
<div id="tel"></div>
<?}?>
Я надеюсь, что это шаг в правильном направлении для yer
Ответ 5
Реализация клиентской стороны может быть реализована с помощью BrowserDetect script и отфильтровать свойства браузера пользователя в этом списке: Могу ли я использовать: URI
var browser = BrowserDetect.browser;
var browserVersion = parseInt(BrowserDetect.version);
var supportsURI = true;
if((browser == 'Firefox' && browserVersion < 2) || (browser == 'Explorer' && browserVersion < 8) || (...)) {
supportsURI = false;
}
(не проверено)
Если браузер не поддерживает URI-схемы, вы можете запустить ссылку и показать лайтбокс, содержащий требуемые данные (например, номер телефона).