3

私は以前にこれに対する「解決策」を見たことがありますが、大きな欠陥があります!

これが私が達成しようとしていることです。

ユーザーが使用する前にログインする必要がある Web アプリがあります。さまざまな理由から、通常の Safari では使用せず、ホーム画面からのみ使用したいと考えています (美的には、フル スクリーンでのみ実際に「機能」します)。

そのため、ユーザーがサイトを閲覧すると、ホーム画面 (この場合はログイン ページが表示されます) または通常のサファリ (この場合、ビューアーにサイトを追加するように促すスプラッシュ スクリーンが表示されます) を介してサイトが開かれたかどうかを検出する必要があります。彼らのホーム画面)。

ホーム画面から開いているか、現在 (window.navigator.standalone を使用して) 開いているかを正常に検出できますが、ホーム画面から開いていない場合は、ユーザーを別のページにリダイレクトする必要があります。これに関する問題は、ユーザーが間違ったページをブックマーク (またはホーム画面に追加) することです。私の知る限り、別のページをホーム画面に追加するように指定する方法はありません。

次のことを試しましたが、うまくいかないようです。

/* Added to login page head */
$(document).ready()
        if (window.navigator.userAgent.indexOf('iPhone') != -1) {
            if (window.navigator.standalone == true) {
                initialize();
            }else{
                $('.container').load('/install.cfm')
            }
        }else{
            $('.container').load('/install.cfm')
        }

編集:@ scunliffeのコメントに基づいて、次のことを試しましたが、これも機能しません(スクリプトが実行される前にjQueryがロードされるため、問題にはなりません);

if (window.navigator.userAgent.indexOf('iPhone') != -1) {
            if (window.navigator.standalone == true) {
                $('#logindiv').show;
            }else{
                $('#installdiv').show;
            }
        }else{
            $('#installdiv').show;
        }
4

2 に答える 2

8

ログインページがデフォルトになるようにロジックを変更できますが、ユーザーが iphone/iOS デバイスを使用している場合は? スタンドアロンで実行していない場合、メッセージが表示されますか?

$(document).ready(function(){
    if(navigator.userAgent.indexOf('iPhone') != -1){//test for other iOS devices?
        if(window.navigator.standalone == true){
            //do stuff!
            initialize();
        } else {
            //show message telling user to add to their home screen...
        }
    } else {
        //show message that this must be run on device X/Y/Z...
    }
});

アップデート:

更新されたサンプルに基づいて、メソッドとして show/hide を呼び出すようにコードを変更するだけです。

$(document).ready(function(){
  if(window.navigator.userAgent.indexOf('iPhone') != -1){
    if(window.navigator.standalone == true){
      $('#logindiv').show();
    } else {
        $('#installdiv').show();
    }
  } else {
    $('#installdiv').show();
  }
});

<div id="logindiv">
  ...stuff to login here...
</div>
<div id="installdiv">
  ...note to install here...
</div>
于 2013-03-04T16:15:19.610 に答える
2

hash-trick「ホーム画面に追加」で使用したものを試すことができます ここに例があります ここに

基本的に、URL の末尾にハッシュがあるかどうかを確認します。ある場合はホーム画面に追加されたことを意味し、そうでない場合は、スクリプトを実行してハッシュを URL に追加できます。そのため、ホーム画面にリンクを追加すると、次に Web アプリを開くと、画面にハッシュが表示されます。それを行うのは一種の面倒な方法ですが、うまくいきます。

于 2013-03-04T19:02:24.460 に答える