javascript - Detección de un controlador de protocolo personalizado en Windows 8+ con Chrome

google-chrome windows-8

Question

Estoy tratando de detectar si mi aplicación para manejar un protocolo personalizado está instalada y funciona con los diferentes navegadores. He mirado otras preguntas en este sitio, tales como: ¿Cómo detectar los controladores de protocolo del navegador? , y han consultado recursos como este para que funcione en la mayoría de las plataformas en la mayoría de los navegadores.

Antes de marcar esto como duplicado, escúchame ...

Pude hacer que mi función funcione en todo, excepto en Chrome en Windows 8+. No puedo usar el método de enfoque de la ventana en Chrome como puedo en Windows 7 porque aparece el mensaje que me pide que busque una aplicación en la tienda.

¿Hay alguna forma (sin una extensión) de detectar un controlador de protocolo personalizado en Windows 8+ en Chrome?

ACTUALIZAR:

El uso de un onBlur para detectarlo solo funciona en Windows 7, porque en 8+, si no encuentra algo para abrir su protocolo, abre el cuadro de diálogo "Encontrar algo de la tienda de aplicaciones" que hace que el navegador pierda el foco.

Answer 1

Creo que esto podría ayudarlo here con diferentes navegadores, pero defina mejor su pregunta o agregue al menos algún tipo de ejemplo para que quede claro.

Answer 2

Hey, creo que estabas en el camino correcto. Definitivamente no es tan fácil, pero hasta el momento no fue mi problema el chrome, más bien como Edge + IE, pero mi solución asume que no admiten el protocolo si algo falla o que no responden correctamente, lo que hacen algunas veces.

El desenfoque / enfoque es algo que debe verificarse, pero debe verificarlo en combinación con un cambio de visibilidad. La API de Visiblity HTML5 y esta publicación me ayudaron a encontrar una solución bastante sólida, excepto los navegadores mencionados anteriormente porque tienen algunos problemas con la función navigator.msLaunchUri y tienen su propio enfoque implementado que no se basa en el desenfoque / enfoque . Pero la función está dañada y no responde correctamente todo el tiempo.

Puedes encontrar mi codepen here . Esperemos que eso te ayude, aunque es un poco tarde para una respuesta. Esto también funciona para los navegadores móviles, pero no probé múltiples, pero funcionó para mi Android 6.0.2. Puede que necesite algunos ajustes a largo plazo, pero creo que es bastante sólido.

(function() {
var noProtocolHash = ''#protocolXYnotsupported'',
checkDelay = 800, // apps might start slowly
isBlurred = false,
inCheck = false,
inLauncherCheck = false,
tabVisible = (function(){
var stateKey,
eventKey,
keys = {
hidden: "visibilitychange",
webkitHidden: "webkitvisibilitychange",
mozHidden: "mozvisibilitychange",
msHidden: "msvisibilitychange"
};
for (stateKey in keys) {
if (stateKey in document) {
eventKey = keys[stateKey];
break;
}
}
return function(c) {
if (c) document.addEventListener(eventKey, c);
return !document[stateKey];
}
})(),
isMSIE = function(){
var rv = -1;
if(navigator.appName == ''Microsoft Internet Explorer''){
var ua = navigator.userAgent;
var re = new RegExp("MSIE ([0-9]{1,}[/.0-9]{0,})");
if(re.exec(ua) != null){
rv = parseFloat(RegExp.$1);
}
}
else if(navigator.appName == ''Netscape''){
var ua = navigator.userAgent;
var re = new RegExp("Trident/.*rv:([0-9]{1,}[/.0-9]{0,})");
if(re.exec(ua) != null){
rv = parseFloat(RegExp.$1);
}
}
return (rv !== -1)? true: false;
},
isEdge = function(){
return window.navigator.userAgent.indexOf("Edge") > -1;
},
checkIfFocusLost = function($el){
try {
document.location.href = $el.attr("href");
} catch (ex) {
document.location.href = document.location.href + ''/'' + noProtocolHash;
}
setTimeout(checkVisibility, checkDelay);
},
checkVisibility = function(){
if(tabVisible() && !isBlurred){
handleNoProtocol();
}
else {
handleProtocol();
}
},
handleNoProtocol = function(){
$(''.result'').text(''has no protocol'');
inLauncherCheck = false;
},
handleProtocol = function(){
$(''.result'').text(''has the protocol'');
inLauncherCheck = false;
},
checkHash = function(){
if(document.location.hash === noProtocolHash){
handleNoProtocol();
}
},
checkLauncherProtocol = function($el){
inLauncherCheck = true;
navigator.msLaunchUri($el.attr("href"), function(){
handleProtocol();
},
function(){
handleNoProtocol();
});
setTimeout(function(){
// fallback when edge is not responding correctly
if(inLauncherCheck === true){
handleNoProtocol();
}
}, 500);
},
checkIfHasProtocol = function($el){
inCheck = true;
if(isEdge() || isMSIE()){
checkLauncherProtocol($el);
}
else {
checkIfFocusLost($el)
}
};
checkHash();
tabVisible(function(){
if(tabVisible() && inCheck){
handleProtocol();
inCheck = false;
}
});
window.addEventListener("blur", function(){
isBlurred = true;
});
window.addEventListener("focus", function(){
isBlurred = false;
inCheck = false;
});
window.checkIfHasProtocol = checkIfHasProtocol;
})();
$(''.protocol'').click(function(e) {
checkIfHasProtocol($(this));
e.preventDefault();
});

Mi código se ha probado con Win10: Chrome, Firefox, IE11, Edge + Android: Chrome (6.0.1)

También existe este proyecto github https://github.com/ismailhabib/custom-protocol-detection que sorta tiene un enfoque similar, quizás un poco más mantenido, pero no pude hacer funcionar su solución por algunas razones, pero tal vez esto sea exactamente Que necesitas.