Detectar si WhatsApp está instalado

Solución:

Mirando la página, parece que al menos en Chrome, abren programáticamente un iframe con el src de whatsapp://send/?phone=<number>&text=test. A continuación, inician un tiempo de espera de 1000 ms después del cual el mensaje “¡Parece que no tiene WhatsApp instalado!” se muestra el texto. Este tiempo de espera es cancelado por un blur manejador de eventos, lo que significa que su verificación se basa en que su dispositivo abra WhatsApp cuando se cargue esa URL, lo que desdibuja la ventana.

La función que se activa después del tiempo de espera también parece verificar si el tiempo de espera tardó más de 1250 ms. Sospecho que esto maneja el caso en el que el navegador de su teléfono deja de ejecutar temporizadores JS cuando cambia de aplicación.

En IE, usan window.navigator.msLaunchUri, que acepta un noHandlerCallback.

Compruébelo usted mismo abriendo las herramientas de desarrollo de su navegador y buscando WhatsAppApiOpenUrl. En Chrome, la búsqueda se puede encontrar en el menú de devtools:

Aquí hay un código de ejemplo.

const detectWhatsapp = (phone, text) => {
  const uri = `whatsapp://send/?phone=${encodeURIComponent(
    phone
  )}&text=${encodeURIComponent(text)}`;

  const onIE = () => {
    return new Promise((resolve) => {
      window.navigator.msLaunchUri(
        uri,
        () => resolve(true),
        () => resolve(false)
      );
    });
  };

  const notOnIE = () => {
    return new Promise((resolve) => {
      const a =
        document.getElementById("wapp-launcher") || document.createElement("a");
      a.id = "wapp-launcher";
      a.href = uri;
      a.style.display = "none";
      document.body.appendChild(a);

      const start = Date.now();
      const timeoutToken = setTimeout(() => {
        if (Date.now() - start > 1250) {
          resolve(true);
        } else {
          resolve(false);
        }
      }, 1000);

      const handleBlur = () => {
        clearTimeout(timeoutToken);
        resolve(true);
      };
      window.addEventListener("blur", handleBlur);

      a.click();
    });
  };

  return window.navigator.msLaunchUri ? onIE() : notOnIE();
};

Tenga en cuenta que agrega un detector de eventos cada vez que se llama. Si está implementando esto en producción, utilice window.removeEventListener para eliminar handleBlur después de que la promesa se resuelva. También agrega un nodo DOM en el cuerpo, si eso le importa.

Ejemplo de uso:

detectWhatsapp('<your number here>', 'test').then(hasWhatsapp =>
  alert('You ' + hasWhatsapp ? "don't have WhatsApp" : 'have WhatsApp')
)

Aquí mis pruebas en Android:

• Built-in Browser (Webview) and Firefox si WA está instalado, puede usar iframe para abrir automáticamente WhatsApp

• Chrome and Opera Necesita una acción de clic del usuario

pero afortunadamente solo necesito este simple código para detectar si whatsapp instalado

document.querySelector('#openWA').addEventListener('click', function() {
  var f = Date.now(),
    j = setTimeout(function() {
      if (Date.now() - f > 1250)
        return;
      alert('WA not installed')
    }, 1e3);
})

<a href="https://foroayuda.es/whatsapp://send/?phone=62812345678&amp;text=test" id="openWA">Send to WhatsApp</button>

<!-- Auto open on WebView and Firefox -->
<iframe id="launcher" src="https://foroayuda.es/whatsapp://send/?phone=62812345678&amp;text=test" style="display: none;"></iframe>

---

---

Utiliza Nuestro Buscador