web-dev-qa-db-ja.com

モバイルデバイスを自分のサイトの代替バージョンにリダイレクトする

モバイルデバイス用のアウトウェブサイトの代替バージョンが用意されています。私たちが提供するコンテンツは異なり、うまく機能します。

提供するバージョンを検出する最良の方法は何ですか。すべてのモバイルデバイスのリストがあるわけではないので、何かを見逃す可能性があるため、user-agentヘッダーを使用するのは難しいです。

デバイスの画面幅を使用することを検討しましたが、モバイルデバイスがjavascriptをサポートしていない場合はどうなりますか。これをどのように嗅ぐのですか?

19
32423hjh32423

要求ヘッダーからクライアントデバイスを認識するデバイス記述データベース( [〜#〜] wurfl [〜#〜] など)を使用できます。次に、そのデータベースにクエリを実行して、デバイスがサイトを処理できるかどうか(JavaScriptをサポートするか、画面が十分に大きいか)を判断してから、別のサイトにリダイレクトするかどうかを決定できます。

環境については言及していませんが、WURFLはJavaとPHP、そしておそらく他のAPIも提供しています。提供されたAPIがない場合でも、WURFLを使用できますが、使用する必要があります。 XMLデータを自分で解析して処理します。

24
skaffman

media = "handheld"は、デスクトップブラウザを装った(screenメディアタイプを使用する)iphoneなどの最新のスマートフォンでは機能しません。

http://detectmobilebrowser.com/ 無料のオープンソースで、javascript、php、asp.net、Rubyなどの多くの言語で利用できる包括的なモバイルユーザーエージェントチェッカーがあります。

8
JohnB

JavaScriptを使用してモバイルサイトにリダイレクトしようとしている場合、WURFLには、JavaScriptを使用してサーバー側の検出を実行できるソリューションもあることに気付きました。

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

次のようなJSONオブジェクトが残ります。

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

これを使用できます:

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

[〜#〜] wurfl [〜#〜] の代わりに Mobile Detect 、a PHP class fordetecting:

  • タブレット
  • モバイル
  • iO
  • Android
  • ブラウザ
  • そして、はるかに

したがって、 [〜#〜] wurfl [〜#〜] が必要なことを実行しない場合は、いつでもこれを確認できます。

2
Sander Koedood

これをヘッダーに入れてください:

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

ほぼすべての人のコンピューター画面が700pxのしきい値を超えていますが、この値は変更できます。 700pxを超える電話やタブレットはありません(少なくとも私は知りません)ので、すべてのモバイル部門はあなたのモバイルサイトにリダイレクトします。

2
Walker

ユーザーがJavaScriptをアクティブにしているかどうかを検出するための良い/エレガントな方法はないと思います。

IMO、最良の方法はユーザーエージェントをリストすることです: ここ はユーザーエージェントリストであり、かなり完全に見えます(悲しいことにフランス語で)。

2

デバイスがJSをサポートしていない場合は、サーバー側のソリューションと[〜#〜] wurfl [〜#〜]APIを検討することをお勧めしますその方向に向かって助けることができます。

この種のアプローチ(リバースプロキシがページをキャッシュし、モバイルバージョンにリダイレクトさせないなど)の問題を回避したい場合や、最近のほとんどすべてのデバイスがJSをサポートしていることを知っている迅速なソリューションが必要な場合があります。

このため、ブラウザのユーザーエージェントを検出し、モバイルデバイスからアクセスしている場合はサイトのモバイルバージョンにリダイレクトする「redirection_mobile.js」というJSスクリプトを作成しました。

モバイルデバイスからデスクトップバージョン(「メインサイトに移動」リンクなど)にリダイレクトしたい場合は、スクリプトがそれを処理し、セッションが終了すると、モバイルバージョンに再びアクセスできます。 。

ここでgithubのソースコードを見つけることができます http://github.com/sebarmeli/JS-Redirection-Mobile-Site そして私の記事の1つで詳細を読むことができます:

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

0
sebarmeli

シンプル:

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

それを頭のセクションに入れてください。

0
yesminusno

これが実用的なソリューションです

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]
0
Akash Chaudhary

Skaffmanに同意すると、別のデバイスデータベースは DeviceAtlas です。ただし、これは有料です。

0
darasd