Heim  >  Artikel  >  Web-Frontend  >  So ermitteln Sie mithilfe von Javascript, ob es sich um ein Mobiltelefon-Login handelt

So ermitteln Sie mithilfe von Javascript, ob es sich um ein Mobiltelefon-Login handelt

PHPz
PHPzOriginal
2023-04-25 16:20:401375Durchsuche

Mit der Popularität von Smartphones entscheiden sich immer mehr Benutzer dafür, Mobiltelefone zu verwenden, um sich auf Websites anzumelden. Bei der Website-Entwicklung müssen wir manchmal feststellen, ob sich der Benutzer über ein Mobiltelefon oder einen Computer anmeldet, um entsprechende Optimierungen und Anpassungen vorzunehmen. In diesem Artikel wird erläutert, wie Sie mithilfe von JavaScript feststellen, ob sich der Benutzer über ein Mobiltelefon anmeldet.

1. Erkennung durch Benutzeragenten

Wir können Browser- und Betriebssysteminformationen vom Benutzeragenten erhalten und feststellen, ob sie bestimmte Schlüsselwörter für mobile Browser enthalten. Um festzustellen, ob der Benutzer über ein Mobiltelefon angemeldet. Im Folgenden finden Sie allgemeine Informationen zum Benutzeragenten für mobile Browser: User-Agent-Informationen für Android-Geräte

Mozilla/5.0 (iPhone; CPU iPhone OS 14_0 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/14.0 Mobile/15E148 Safari/604.1
Mozilla/5.0 (iPad; CPU OS 14_0 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) CriOS/86.0.4240.93 Mobile/15E148 Safari/604.1
  • Wir können reguläre Ausdrücke verwenden, um den User-Agent abzugleichen und festzustellen, ob er die Schlüsselwörter des mobilen Browsers enthält. Das Folgende ist der JavaScript-Code, um festzustellen, ob es sich um eine mobile Anmeldung handelt:

    Mozilla/5.0 (Linux; Android 11; Pixel 5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/86.0.4240.198 Mobile Safari/537.36
  • Im obigen Code erhalten wir zunächst die Benutzeragenteninformationen des Browsers und verwenden dann reguläre Ausdrücke, um festzustellen, ob dies der Fall ist enthält Schlüsselwörter für iPhone, iPad, iPod und Android sowie andere mobile Browser und gibt schließlich einen booleschen Wert zurück, der angibt, ob sich der Benutzer über ein Mobiltelefon angemeldet hat.
  • 2. Erkennung anhand der Bildschirmauflösung

  • Eine weitere Möglichkeit, festzustellen, ob sich der Benutzer über ein Mobiltelefon anmeldet, ist die Erkennung anhand der Bildschirmauflösung. Da die Bildschirmauflösungen von Mobiltelefonen und Computern sehr unterschiedlich sind, können wir anhand der Bildschirmauflösung feststellen, ob sich der Benutzer über ein Mobiltelefon oder einen Computer anmeldet.

Normalerweise überschreitet die Breite von Mobiltelefonbildschirmen 768 Pixel nicht, während die Breite von Computerbildschirmen normalerweise größer als 1024 Pixel ist. Daher können wir feststellen, ob die aktuelle Bildschirmbreite weniger als 768 Pixel beträgt, um festzustellen, ob sich der Benutzer über ein Mobiltelefon anmeldet.

Das Folgende ist der JavaScript-Code, um festzustellen, ob es sich um eine Mobiltelefonanmeldung handelt:

function isMobile() {
    const ua = navigator.userAgent;
    const isIOS = /iPhone|iPad|iPod/i.test(ua);
    const isAndroid = /Android/i.test(ua);
    const isMobile = isIOS || isAndroid;
    return isMobile;
}

Im obigen Code ermitteln wir die Breite des aktuellen Fensters und bestimmen, ob dies der Fall ist kleiner oder gleich 768 Pixel ist. Stellen Sie fest, ob sich der Benutzer über ein Mobiltelefon anmeldet.

3. Umfassende Nutzung

Die beiden oben genannten Methoden haben jeweils ihre eigenen Vor- und Nachteile, und Sie müssen sie entsprechend der tatsächlichen Situation auswählen. Normalerweise können wir zwei Methoden kombinieren, um die Genauigkeit der Beurteilung zu verbessern.

Das Folgende ist der JavaScript-Code, der die beiden oben genannten Methoden verwendet:

function isMobile() {
    const width = window.innerWidth;
    const isMobile = width <= 768;
    return isMobile;
}

Im obigen Code erhalten wir die Benutzeragenteninformationen des Browsers und die Breite des aktuellen Fensters Verwenden Sie gleichzeitig reguläre Ausdrücke und die Bildschirmauflösung, um festzustellen, ob der Benutzer über ein Mobiltelefon angemeldet ist.

Zusammenfassung

Die Verwendung von JavaScript zur Feststellung, ob sich der Benutzer über ein Mobiltelefon anmeldet, kann uns dabei helfen, entsprechende Optimierungen und Anpassungen vorzunehmen, um das Benutzererlebnis der Website zu verbessern. In diesem Artikel werden zwei Beurteilungsmethoden vorgestellt, nämlich die Verwendung der Benutzeragentenerkennung und der Bildschirmauflösungserkennung, sowie deren umfassende Verwendung. Ich hoffe, dass dieser Artikel für alle Entwickler hilfreich sein kann.

Das obige ist der detaillierte Inhalt vonSo ermitteln Sie mithilfe von Javascript, ob es sich um ein Mobiltelefon-Login handelt. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn