スマートフォンでPCサイトへアクセスした際の挙動

スマートフォンでPCサイトのURLへアクセスした際
「スマートフォン用サイトを表示しますか？」というアラートを出しているのですが、
なぜかブラウザがフリーズしてしまいます。

該当部分のコードは下記になるのですが、特にコード上は問題ないと思います。
JSで、スマホであれば「/sp/」へアクセスするようにしています。

$(function(){
        //ユーザーエージェントを取得
        var ua = navigator.userAgent;
        //スマートフォンの条件の設定
        var sp_flag = (ua.indexOf('iPhone') > 0 || ua.indexOf('iPod') > 0 || ua.indexOf('Android') > 0 )
        //スマートフォンでしか表示しないボタンを非表示
        if(sp_flag){
          $('.sp_btn').show();
        }

        //ポップアップウインドウを出す設定
        if (sessionStorage
          && !sessionStorage.getItem("sp_flag_set")
          && sp_flag) {
          if(confirm('スマートフォン用サイトを表示しますか？')) {
            location.href ='<?php echo $targetUrl; ?>';//スマートフォンサイトのURLに書き換えてください。
            sessionStorage.setItem("sp_flag_set",false);
          }else{
            sessionStorage.setItem("sp_flag_set",true);
          }
        }

      });

今のところ、
Android 8.0 Chrome => NG
Android 6.0 Chrome => OK
iPhone10 => OK
iPhone7 => OK
という状況なのですが、最新のAndroidでの事象という可能性が高いのでしょうか？

また、確かめる方法があれば教えてほしいです。

JSではなく.htaccessでのリダイレクトに変更した方が良いのか悩んでいます。

行動規範の内容に同意します

回答2件

JSではなく.htaccessでのリダイレクトに変更した方が良いのか悩んでいます。

そうですね、そちらの方が良いでしょう。
以下根拠。

そもそも論でいうならばスマホファーストであるべきです。

そしてスマホのChromeにはUserAgentを切り替える「PC版サイトを見る」というオプションが存在します。
Firefoxにも同様のオプションが存在します。
ユーザーはPC版サイトが見たければ、各自が勝手にこのオプションの「PC版サイトを見る」を使うので無理してJSで出し分ける必要はありません。

今回はPC用とスマホ用でHTMLがきっぱり別れているので、
.htaccessで/sp/へのこっそりリダイレクトを仕込んでおく方が、
ユーザーフレンドリーじゃないかなぁと思います。

投稿2019/03/14 07:22

miyabi-sun

総合スコア21158

avantgarden

2019/03/14 08:00

確かに、スマホでアクセスした際はまずスマホサイトを出す、というのがユーザーフレンドリーですね。中々そこまで考えが及んでいませんでした。ありがとうございます。

行動規範の内容に同意します

ベストアンサー

環境(端末、OS、ブラウザ)依存の問題切り分けの手段としてぱっと思いつくのはこれくらいですかね。

・問題の端末(Android8.0)でChrome以外のブラウザを使用してみる
→同様の問題が発生しないのであれば、Chromeの問題。
・Android8.0の他の端末で(同じバージョンの)Chromeを使用してみる
→同様の問題が発生しないのであれば、端末の問題
・問題の端末(Android8.0)でChrome BetaやChrome Devを使用してみる
→同様の問題が発生しないのであれば、Chromeの問題であり、そのうち修正される

投稿2019/03/14 04:36