Umleiten mobile Geräte auf alternative Version meiner Website

StackOverflow https://stackoverflow.com/questions/1118581

Frage

Wir haben eine alternative Version von unserer Internet-Seite bereit für mobile Geräte bekommen. Die Inhalte, die wir dienen, ist anders und es funktioniert gut.

Was ist die beste Art und Weise zu dienen, welche Version zu erkennen. Wir haben nicht eine Liste aller mobilen Geräte so der Header User-Agent zu verwenden, ist schwierig, da wir etwas verpassen können.

Wir dachten über Gerätebildschirmbreite useing - aber was passiert, wenn das mobile Gerät kein Javascript unterstützt. Wie können wir diese schnuppern?

War es hilfreich?

Lösung

Sie können eine Gerätebeschreibungsdatenbank (wie WURFL ) verwenden, die das Client-Gerät aus der Anforderung erkennen Header. Sie können dann die Datenbank abfragen, um zu entscheiden, ob das Gerät Ihrer Website (z Javascript unterstützen, oder der Bildschirm ist groß genug) verarbeiten kann, bevor sie entscheidet, ob sie auf eine andere Website umgeleitet werden.

Sie erwähnen nicht die Umgebung, sondern WURFL liefert APIs für Java und PHP, und vielleicht auch andere. Wenn es keine mitgelieferte API ist, können Sie immer noch WURFL verwenden, aber Sie werden müssen, um die XML-Daten selbst analysieren und zu verarbeiten.

Andere Tipps

media = „Handheld“ nicht mit modernen Smartphones wie der iPhone arbeiten, die so tun, als ein Desktop-Browser sein (nutzt den Bildschirm Medientyp).

http://detectmobilebrowser.com/ Free & Open Source, hat einen umfassenden mobilen User-Agenten-Checker in vielen Sprachen - Javascript, php, asp.net, Rubin, etc

.

Wenn Sie auf eine mobile Website umleiten mit JavaScript, bemerkte ich, dass WURFL hat auch eine Lösung für das ermöglicht es Ihnen, Server-Side-Erkennung mit JavaScript zu tun. 

<script type='text/javascript' src="//wurfl.io/wurfl.js"></script>

Sie werden mit einem JSON-Objekt gelassen werden, die wie folgt aussieht: 

{
     "complete_device_name":"Apple iPhone 6",
     "is_mobile":true,
     "form_factor":"Smartphone"
}

Sie können diese dann verwenden: 

if (WURFL.is_mobile === true) {
    window.location.replace("http://stackoverflow.com");
}

Das glaube ich nicht, dass es eine gute / elegante Art und Weise ist zu erkennen, ob seine Javascript Benutzer aktiviert hat.

IMO, ist der beste den User-Agent zur Liste: hier ist ein User-Agent-Liste, die (in Französisch, leider) ganz vollständig zu sein scheint.

Just setzen diese in der Kopfzeile: 

<script type="text/javascript">
 <!--
  if (screen.width <= 700) {
  window.location = "http://www.mobile-site.com";
  }
 //-->
</script>

So gut wie jeder Computer-Bildschirme über der Schwelle von 700px sind aber vaule kann geändert werden. Es ist nicht ein Handy oder Tablet gibt, die oberhalb von 700px (zumindest ich weiß, irgend nicht), so dass alle mobilen divices auf Ihre mobile Website umleitet.

Eine Alternative zu WURFL Handy Detect , eine PHP-Klasse zum erkennen:

  • Tablet
  • Mobil
  • iOs
  • Android
  • Browser
  • Und viel mehr

So im Falle WURFL nicht tun, was Sie brauchen, können Sie immer diese überprüfen.

In Übereinstimmung mit Skaffman, ein anderes Gerät Datenbank Device . Sie haben allerdings für diese zahlen.

Wenn das Gerät nicht JS unterstützen, dann ist es besser, eine serverseitige Lösung zu prüfen, und WURFL API kann in diese Richtung helfen.

Manchmal wollen wir Problem mit dieser Art von Ansatz (wie ein Reverse-Proxy-Caches Seiten und lassen Sie sich nicht auf die mobile Version umleiten) vermeiden oder wir brauchen eine schnelle Lösung zu wissen, dass heute fast alle bisherigen Geräte JS unterstützen.

Aus diesem Grund schrieb ich ein JS-Skript „redirection_mobile.js“ genannt, die den User-Agent des Browsers erkennt und leitet auf die mobile Version Ihrer Website, wenn Sie es von einem Mobilgerät zugreifen.

In einigen Fällen Sie von einem mobilen Gerät auf eine Desktop-Version umleiten möchten (wie mit einem Link „auf die Hauptseite Go“), wird das Skript damit umgehen, und wenn Sie Ihre Sitzung beenden, werden Sie auf den Zugang Mobile-Version wieder.

Sie können den Quellcode auf Github finden hier http://github.com/sebarmeli / JS-Redirection-mobile-Website und können Sie mehr Details in einem meinem Artikel hier lesen:

http://blog.sebarmeli.com/2010/11/02/how-to-redirect-your-site-to-a-mobile-version-through-javascript/

Ganz einfach: 

<link rel="alternate" media="handheld" href="WEBSITE HERE">

setzt, dass im Kopfbereich.

Hier ist die Arbeitslösung 

RewriteEngine On
RewriteBase /

#http://stackoverflow.com/questions/3680463/mobile-redirect-using-htaccess
# Check if mobile=1 is set and set cookie 'mobile' equal to 1
RewriteCond %{QUERY_STRING} (^|&)mobile=1(&|$)
RewriteRule ^ - [CO=mobile:1:%{HTTP_HOST}]

# Check if mobile=0 is set and set cookie 'mobile' equal to 0
RewriteCond %{QUERY_STRING} (^|&)mobile=0(&|$)
RewriteRule ^ - [CO=mobile:0:%{HTTP_HOST}]

# cookie can't be set and read in the same request so check
RewriteCond %{QUERY_STRING} (^|&)mobile=0(&|$)
RewriteRule ^ - [S=1]

# Check if this looks like a mobile device
RewriteCond %{HTTP:x-wap-profile} !^$ [OR]
RewriteCond %{HTTP_USER_AGENT} "android|blackberry|ipad|iphone|ipod|iemobile|opera mobile|palmos|webos|googlebot-mobile" [NC,OR]
RewriteCond %{HTTP:Profile}       !^$
RewriteCond %{QUERY_STRING} !^mobile=0(?:&|$)
# Check if we're not already on the mobile site
RewriteCond %{HTTP_HOST}          !^m\.
# Check to make sure we haven't set the cookie before
RewriteCond %{HTTP:Cookie}        !\mobile=0(;|$)
# Now redirect to the mobile site
RewriteRule ^ http://m.yourdomain.com%{REQUEST_URI} [R,L]

# Go back to full site
RewriteCond %{HTTP_HOST} ^m\.
RewriteCond %{QUERY_STRING} (?:^|&)mobile=0(?:&|$)
RewriteRule ^ http://yourdomain.com%{REQUEST_URI} [R,L]

RewriteCond %{REQUEST_FILENAME} -s [OR]
RewriteCond %{REQUEST_FILENAME} -l [OR]
RewriteCond %{REQUEST_FILENAME} -d
RewriteRule ^ - [NC,L]

RewriteRule ^.*$ index.php [NC,L]
Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top