wake-up-neo.com

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

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

Wenn Sie von einem Web-Clip aus navigieren, leiten Sie nicht um .. .. Wenn Sie von mobiler Safari aus navigieren, leiten Sie zu safari.aspx um .. Wenn Sie von einem anderen Ort aus navigieren, leiten Sie zu unavailable.aspx

Ich konnte iPhone WebApps verwenden. Gibt es eine Möglichkeit, festzustellen, wie es geladen wurde? Home Screen vs Safari? um festzustellen, ob der Benutzer von einem Webclip aus navigiert hat, ich habe jedoch Probleme, zu ermitteln, ob der Benutzer auf einem iPhone oder iPod von Mobile Safari aus 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";
}
48
Steven

UPDATE: Dies ist eine sehr alte Antwort, die ich nicht löschen kann, da die Antwort akzeptiert wird. Überprüfen Sie die Antwort der unwissenden Person für eine bessere Lösung.


Sie sollten die Zeichenfolge "iPad" oder "iPhone" im user agent string prüfen können:

var userAgent = window.navigator.userAgent;

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

Siehe https://developer.chrome.com/multidevice/user-agent#chrome_for_ios_user_agent - Die Zeichenfolgen des Benutzeragenten für Safari unter iOS und für Chrome unter iOS sind unpraktisch ähnlich:

Chrome

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 in anderen Antworten vorgeschlagen, und dann nach den Elementen zu filtern, 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);
128
unwitting

best Practice ist:

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

Fallender Code findet nur mobile Safari und sonst nichts (außer Delphin und andere kleine Browser)

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

Alle Antworten und Kommentare zusammengeführt.

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

Wenn Sie alle Antworten sehen, finden Sie hier einige Tipps zu den vorgeschlagenen RegExes:

  • AppleWebKit passt auch zu Desktop Safari (nicht nur für Mobilgeräte)
  • es ist nicht erforderlich, .match für solche einfachen Regex mehr als einmal aufzurufen, und bevorzugen Sie die einfachere .test-Methode.
  • das g (global) Regex-Flag ist unbrauchbar, während die i (Groß- und Kleinschreibung) nützlich sein kann
  • keine Erfassung erforderlich (Klammern), wir testen nur die Zeichenfolge

Ich verwende dies nur, da es für mich in Ordnung ist, true für mobiles Chrome zu erhalten (dasselbe Verhalten):

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

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

2
antoine129

Ich habe die Antwort von @unwitting abgelehnt, da sie mich zwangsläufig in Bewegung setzte. Beim Rendern meines SPA in einem iOS-Webview musste ich ihn jedoch ein wenig anpassen. 

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

Der Hauptunterschied besteht in der Umbenennung von webkit in webkitUa, um zu vermeiden, dass das webkit-Stammobjekt, das als Message-Handler zwischen SPA & UIView verwendet wird, in Konflikt gerät.

1
pimbrouwers

Tatsächlich gibt es keine silberne Kugel, mobile Safari zu entdecken. Es gibt einige Browser, die die Schlüsselwörter des Benutzeragenten von Mobile Safari verwenden. Vielleicht können Sie die Funktionserkennung ausprobieren und die Regel ständig aktualisieren.

1
Light

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

Ich musste feststellen, wann ein Benutzer von Desktop Safari aus navigiert (da wir uns Mitte 2017 befinden und Apple keine Unterstützung für input[type="date"] YET gegeben hat ...

Also habe ich einen Fallback Custom Datepicker dafür gemacht). Dies gilt jedoch nur für Desktop-Safaris, da dieser Eingabetyp in Mobile Safari einwandfrei funktioniert. Also habe ich diese Regex so gemacht, dass sie nur Desktop Safari erkennt. Ich habe es bereits getestet und passt nicht zu Opera, Chrome, Firefox oder Safari Mobile. 

Ich hoffe, es kann einigen von euch helfen.

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

Ich suchte nach dieser Antwort und ich erinnerte mich, dass ich das schon vorher gesehen hatte. 

Der zuverlässigste Weg, um Safari in 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 window.outerHeight-Eigenschaft und die window.outerWidth-Eigenschaft zurück. 

Dies gilt für alle iPads und iPhones in allen iOS-Versionen. Bei jedem anderen Browser und Gerät funktioniert diese Eigenschaft normal.

Nicht sicher, ob sie dies ändern wollen, aber im Moment funktioniert es gut.

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