Stellen Sie fest, ob der Benutzer von Mobile Safari aus navigiert hat

Ich habe eine App und möchte die Benutzer auf verschiedene Seiten umleiten, je nachdem, von wo aus sie navigieren.

Wenn Sie von einem Webclip aus navigieren, leiten Sie nicht um. Wenn Sie von Mobile Safari aus navigieren, leiten Sie zu safari.aspx weiter. Wenn Sie von einem anderen Ort aus navigieren, leiten Sie zu unavailable.aspx um

Ich konnte iPhone-Webanwendungen verwenden. Gibt es eine Möglichkeit, festzustellen, wie sie geladen wurden? Startbildschirm vs Safari? um festzustellen, ob der Benutzer von einem Webclip aus navigiert hat, aber ich habe Probleme festzustellen, ob der Benutzer von Mobile Safari auf einem iPhone oder iPod navigiert hat.

Folgendes habe ich:

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";
}

UPDATE : Dies ist eine sehr alte Antwort und ich kann sie nicht löschen, da die Antwort akzeptiert wird. Überprüfen Sie die Antwort von unwitting unten, um eine bessere Lösung zu finden.

Sie sollten in der Benutzeragentenzeichenfolge nach dem Teilstring "iPad" oder "iPhone" suchen können :

var userAgent = window.navigator.userAgent;

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

Siehe https://developer.chrome.com/multidevice/user-agent#chrome_for_ios_user_agent - Die Benutzeragentenzeichenfolgen für Safari unter iOS und Chrome unter iOS sind ungünstig ähnlich:

Chrom

Mozilla/5.0 (iPhone; U; CPU iPhone OS 5_1_1 like Mac OS X; en) AppleWebKit/534.46.0 (KHTML, like Gecko) CriOS/19.0.1084.60 Mobile/9B206 Safari/7534.48.3

Safari

Mozilla/5.0 (iPhone; U; CPU like Mac OS X; en) AppleWebKit/420+ (KHTML, like Gecko) Version/3.0 Mobile/1A543 Safari/419.3

Es sieht so aus, als ob der beste Ansatz hier darin besteht, zunächst nach iOS zu suchen, wie andere Antworten vorgeschlagen haben, und dann nach den Dingen zu filtern, die die Safari UA einzigartig machen. Ich würde vorschlagen, dass dies am besten mit "ist AppleWebKit und ist nicht CriOS" erreicht wird:

var ua = window.navigator.userAgent;
var iOS = !!ua.match(/iPad/i) || !!ua.match(/iPhone/i);
var webkit = !!ua.match(/WebKit/i);
var iOSSafari = iOS && webkit && !ua.match(/CriOS/i);

Best Practice ist:

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

Fallender Code findet nur mobile Safari und nichts anderes (außer Delphin und anderen kleinen Browsern)

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

Alle Antworten und Kommentare zusammengeführt. Und das ist das Ergebnis.

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));

Nach all den Antworten finden Sie hier einige Tipps zu den vorgeschlagenen RegExes:

• AppleWebKit passt auch zu Desktop Safari (nicht nur mobil)
• Sie müssen nicht .matchmehr als einmal für solche einfachen regulären Ausdrücke aufrufen und bevorzugen die leichtere .testMethode.
• Das g(globale) Regex-Flag ist nutzlos, während das i(ohne Berücksichtigung der Groß- und Kleinschreibung) nützlich sein kann
• Keine Notwendigkeit für die Erfassung (Klammern), wir testen nur die Zeichenfolge

Ich benutze dies nur, da es truefür mich in Ordnung ist, für Mobile Chrome zu werden (gleiches Verhalten):

/iPhone|iPad|iPod/i.test(navigator.userAgent)

(Ich möchte nur erkennen, ob das Gerät ein Ziel für eine iOS-App ist.)

Tatsächlich gibt es keine Silberkugel für die Erkennung mobiler Safari. Es gibt einige Browser, die möglicherweise die Schlüsselwörter des Benutzeragenten von Mobile Safari verwenden. Möglicherweise können Sie die Funktionserkennung versuchen und die Regel ständig aktualisieren.

Ich weiß, dass dies ein alter Thread ist, aber ich möchte meine Lösung mit euch teilen.

Ich musste erkennen, wann ein Benutzer von Desktop Safari aus navigiert (weil wir Mitte 2017 sind und Apple noch keine Unterstützung für input[type="date"]...

Also habe ich einen benutzerdefinierten Fallback-Datepicker dafür erstellt. Dies gilt jedoch nur für Safari auf dem Desktop, da dieser Eingabetyp in Mobile Safari einwandfrei funktioniert. Also habe ich diesen Regex gemacht, um nur Desktop-Safari zu erkennen. Ich habe es bereits getestet und es passt nicht zu Opera, Chrome, Firefox oder Safari Mobile.

Hoffe, es kann einigen von euch helfen.

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

Ich habe die Antwort von @unwitting positiv bewertet, da sie mich unweigerlich in Schwung gebracht hat. Beim Rendern meines SPA in einer iOS-Webansicht musste ich es jedoch etwas anpassen.

function is_iOS () {
    /*
        Returns (true/false) 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 webkitUa !== 'undefined' && iOS && webkitUa && !ua.match(/CriOS/i);
};

Der Hauptunterschied besteht in der Umbenennung von webkitin webkitUa, um Konflikte mit dem webkitStammobjekt zu vermeiden, das als Nachrichtenhandler zwischen SPA und UIView verwendet wird.

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

Ich suchte nach dieser Antwort und erinnerte mich, dass ich darauf schon einmal gestoßen war.

Der zuverlässigste Weg, um Safari unter iOS in JavaScript zu erkennen, ist

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

or 

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

Aus irgendeinem Grund gibt Safari unter iOS 0 für die Eigenschaften window.outerHeight und window.outerWidth zurück.

Dies gilt für alle iPads und iPhones aller iOS-Versionen. Jeder andere Browser und jedes andere Gerät dieser Eigenschaft funktioniert normal.

Ich bin mir nicht sicher, ob sie dies ändern wollen, aber im Moment funktioniert es gut.

Diese Regex funktioniert für mich, sauber und einfach

const isIOSSafari = !! window.navigator.userAgent.match (/ Version / [\ d.] +. * Safari /);