javascript redirect - Determine si el usuario navegó desde Safari móvil





to mobile (10)


En realidad, no hay una bala de plata para detectar un safari móvil. Hay bastantes navegadores que pueden usar las palabras clave del agente de usuario de safari móvil. Tal vez pueda probar la detección de características y seguir actualizando la regla.

Tengo una aplicación y me gustaría redirigir a los usuarios a diferentes páginas según el lugar desde el que navegan.

Si navega desde un clip web, no redirija. Si navega desde Safari móvil, redirija a safari.aspx. Si navega desde cualquier otro lugar, redirija a no disponible.aspx

Pude utilizar las aplicaciones web de iPhone, ¿hay alguna forma de detectar cómo se cargó? Pantalla de Inicio vs Safari? para determinar si el usuario estaba navegando desde un clip web, pero tengo problemas para determinar si el usuario navegó desde Safari para dispositivos móviles en un iPhone o iPod.

Esto es lo que tengo:

if (window.navigator.standalone) {
    // user navigated from web clip, don't redirect
}
else if (/*logic for mobile Safari*/) {
    //user navigated from mobile Safari, redirect to safari page
    window.location = "safari.aspx";
}
else {
    //user navigated from some other browser, redirect to unavailable page
    window.location = "unavailable.aspx";
}



ACTUALIZACIÓN : Esta es una respuesta muy antigua y no puedo eliminarla porque se acepta la respuesta. Verifique la respuesta de la persona que está abajo para encontrar una mejor solución

Debería poder verificar la subcadena "iPad" o "iPhone" en la cadena de agente de usuario :

var userAgent = window.navigator.userAgent;

if (userAgent.match(/iPad/i) || userAgent.match(/iPhone/i)) {
   // iPad or iPhone
}
else {
   // Anything else
}



function isIOS {
  var ua = window.navigator.userAgent;
  return /(iPad|iPhone|iPod).*WebKit/.test(ua) && !/(CriOS|OPiOS)/.test(ua);
}



Estaba buscando esta respuesta y recordé que encontré esto antes.

La forma más confiable de detectar Safari en iOS en JavaScript es

if (window.outerWidth === 0) {
    // Code for Safari on iOS
} 

or 

if (window.outerHeight === 0) {
    // Code for Safari on iOS
} 

Por alguna razón, Safari en iOS devuelve 0 para propiedad window.outerHeight y propiedad window.outerWidth.

Esto es para todos los iPads y iPhones en todas las versiones de iOS. Cada otro navegador y dispositivo esta propiedad funciona normalmente.

No estoy seguro si pretenden cambiar esto pero por ahora funciona bien.




El código que cae solo encuentra el safari móvil y nada más (excepto los delfines y otros navegadores pequeños)

  (/(iPad|iPhone|iPod)/gi).test(userAgent) &&
  !(/CriOS/).test(userAgent) &&
  !(/FxiOS/).test(userAgent) &&
  !(/OPiOS/).test(userAgent) &&
  !(/mercury/).test(userAgent)



Aumenté la respuesta de @unwitting, ya que inevitablemente me hizo seguir. Sin embargo, al renderizar mi SPA en una vista web de iOS, necesitaba modificarlo un poco.

function is_iOS () {
    /*
        Returns whether device agent is iOS Safari
    */
    var ua = navigator.userAgent;
    var iOS = !!ua.match(/iPad/i) || !!ua.match(/iPhone/i);
    var webkitUa = !!ua.match(/WebKit/i);

    return typeof webkit !== 'undefined' && iOS && webkit && !ua.match(/CriOS/i);
};

La principal diferencia es el cambio de nombre de webkit a webkitUa , para evitar el conflicto con el objeto webkit raíz utilizado como controlador de mensajes entre SPA y UIView.




la mejor práctica es:

function isMobileSafari() {
    return navigator.userAgent.match(/(iPod|iPhone|iPad)/) && navigator.userAgent.match(/AppleWebKit/)
}



Se fusionaron todas las respuestas y comentarios. Y este es el resultado.

function iOSSafari(userAgent)
{
    return /iP(ad|od|hone)/i.test(userAgent) && /WebKit/i.test(userAgent) && !(/(CriOS|FxiOS|OPiOS|mercury)/i.test(userAgent));
}



var iOSSafari = /iP(ad|od|hone)/i.test(window.navigator.userAgent) && /WebKit/i.test(window.navigator.userAgent) && !(/(CriOS|FxiOS|OPiOS|mercury)/i.test(window.navigator.userAgent));



Sé que este es un hilo viejo, pero me gustaría compartir mi solución con ustedes.

Necesitaba detectar cuándo un usuario navega desde Desktop Safari (porque estamos en la mitad de 2017, y Apple no ha dado soporte para la input[type="date"] AÚN ...

Por lo tanto, hice un selector de fechas personalizado de reserva para ello. Pero solo se aplica a safari en el escritorio porque ese tipo de entrada funciona bien en Safari móvil. Entonces, hice este Regex para detectar solo el Safari de escritorio. Ya lo probé y no coincide con Opera, Chrome, Firefox o Safari Mobile.

Espero que pueda ayudar a algunos de ustedes.

if(userAgent.match(/^(?!.*chrome).(?!.*mobile).(?!.*firefox).(?!.*iPad).(?!.*iPhone).*safari.*$/i)){
  $('input[type="date"]').each(function(){
    $(this).BitmallDatePicker();
  })
}



La propiedad viewport minimal-ui ya no es compatible con iOS 8. Sin embargo, el mínimo-ui en sí no se ha ido. El usuario puede ingresar al minimal-ui con un gesto de "tocar y arrastrar hacia abajo".

Existen varias precondiciones y obstáculos para administrar el estado de la vista, por ejemplo, para que el mínimo de trabajo funcione, tiene que haber suficiente contenido para permitir al usuario desplazarse; para que el mínimo-ui persista, el desplazamiento de la ventana se debe compensar en la carga de la página y después del cambio de orientación. Sin embargo, no hay forma de calcular las dimensiones del ui mínimo utilizando la variable de screen , y por lo tanto, no hay forma de saber cuándo el usuario está en el ui mínimo de antemano.

Estas observaciones son el resultado de una investigación como parte del desarrollo de Brim - view manager para iOS 8 . La implementación final funciona de la siguiente manera:

Cuando se carga la página, Brim creará un elemento de cinta de correr. El elemento de la rueda de ardilla se usa para dar espacio al usuario para desplazarse. La presencia del elemento de cinta de correr asegura que el usuario pueda ingresar a la vista de ui mínimo y que continúe persistiendo si el usuario vuelve a cargar la página o cambia la orientación del dispositivo. Es invisible para el usuario todo el tiempo. Este elemento tiene ID brim-treadmill .

Al cargar la página o después de cambiar la orientación, Brim está usando Scream para detectar si la página está en la vista de ui mínimo (la página que ha estado previamente en minimal-ui y ha sido recargada permanecerá en el mínimo-ui si la altura del contenido es mayor que la altura de la ventana gráfica).

Cuando la página está en el mínimo-ui, Brim deshabilitará el desplazamiento del documento (lo hace de una manera segura que no afecta el contenido del elemento principal). Al deshabilitar el desplazamiento de documentos se evita accidentalmente dejar el ui mínimo cuando se desplaza hacia arriba. Según la especificación original de iOS 7.1, al tocar la barra superior se recupera el resto del cromado.

El resultado final se ve así:

Por el bien de la documentación, y en caso de que prefiera escribir su propia implementación, vale la pena señalar que no puede usar Scream para detectar si el dispositivo está en mínimo ui inmediatamente después del evento de orientationchange porque window dimensiones de la window no reflejan la nueva orientación hasta la animación de rotación ha terminado. Tienes que adjuntar un oyente al evento orientationchangeend .

Scream y orientationchangeend se han desarrollado como parte de este proyecto.





javascript iphone mobile-safari web-clips