4

Azure モバイル サービス認証を使用してログインする HTML5 アプリケーションがあります (コード例から直接... 以下に示します)。すべてのデスクトップ ブラウザと iPhone 5 の Safari で問題なく動作します。しかし、アプリ/フルスクリーンモードからは何もしません(サファリのようにポップアップウィンドウを表示する許可を求めず、ポップアップウィンドウは表示されません)、私は永遠に待つことができ、何も起こりません. もう一度呼び出すと、「エラー: 予期しないエラー」というエラーが表示されます...おそらく最初の試行がまだ実行されているためですか? ヘルプ/洞察をいただければ幸いです。

client.login ("facebook").done(function (results) {
     alert("You are now logged in as: " + results.userId);
}, function (err) {
     alert("Error: " + err);
});

より多くの情報と2つの潜在的なアイデアを含む編集された更新*

さらに調査を行ったところ、この問題を克服し、認証に対する現在の Azure モバイル アプローチの他の 2 つの副作用も解決するアプローチを使用するサイトを見つけました。コードには他の認証オプションのヒントがいくつかあるため、Azure モバイル チームは同様のことを検討している可能性があると思います (ただし、最小化されたコードは難読化されているため、読みにくく、確認するのは困難です)。コードでこれらをアクティブにするだけの問題かもしれません...

ソリューション":

http://m.bcwars.com/にアクセスし、Facebook ログインをクリックします。ポップアップを実行する代わりに、単に現在のブラウザ ウィンドウにとどまるため、「アプリ モード」の iPhone Safari で完全に動作することがわかります。

このアプローチは、現在の Azure モバイル アプローチに関する他の 2 つの問題を解決します。まず、ポップアップはほとんどのブラウザーによって潜在的な広告として解釈され、自動的にブロックされます (デスクトップ Chrome) ...そして、ユーザーはそれが機能していない理由を知りません...または、ユーザーが承認する必要がある警告を出します ( 「ブラウザモード」のiPhone Safari)は面倒です。また、ユーザーがポップアップ ブロッカーを使用している場合、それはより困難になり、ユーザーが適切に機能しない可能性がさらに高くなります。bcwars.com メソッドにはこの問題はありません。

次に、iPhone Safari では、ポップアップ ウィンドウが自動的に閉じると、Safari で他のブラウザ ウィンドウが開いていると、元のページにフォーカスが移動しません。代わりに、どちらを表示するかを選択できるように、小さい/スライド モードになっています。これが発生した場合、ユーザーはもう 1 つの手順を実行する必要があります... ブラウザ ウィンドウをクリックしてアクティブにし、フォーカスを与えます.. これもまた面倒で、混乱して正しく実行できず、必要になる可能性が高くなります。ヘルプ。m.bcwars.com にはこの問題はありません。

Azure オプション:

Azure モバイル コードを見ると、既にソリューションがあるように見えます。縮小/難読化されているため、簡単に読むことはできませんが、認証を呼び出すための4つのオプション(iFrameなどを含む)があり、1つ(ポップアップの「理想的ではないもの」)のみが使用されているようです。簡単な解決策は、代替認証の 1 つが機能するようにプロパティを設定することです。しかし、それを理解するのに十分なほど読むことはできません。もう 1 つの方法は、コードをハッキングすることです (Microsoft が修正プログラムを提供するまで一時的に)。

多分そこで助けを得ることができますか?

4

1 に答える 1

0

ポップアップを使用しない Facebook での認証フローを実装できます。基本的な考え方は、ログインを行うために「Web フロー」を使用し、ログインからウィンドウが戻ったら、アクセス トークンを使用してユーザーを Azure Mobile Services にログインさせることです。

これを行うための Facebook ドキュメントはこちら: https://developers.facebook.com/docs/facebook-login/login-flow-for-web-no-jssdk/#step2

簡単にするためのいくつかのコードサンプル。

次のようなことから始めます。

(YOUR_APP_ID と YOUR_URL をサイトに関連するものに置き換えることを忘れないでください。

function logIn() {
    window.location.replace('https://www.facebook.com/dialog/oauth?client_id=YOUR_APP_ID&redirect_uri=http%3A%2F%2FYOUR_URL&response_type=token')
}

これにより、ユーザーがログインしてアプリを承認できるように、ウィンドウが Facebook ページにリダイレクトされます。ユーザーの操作が完了すると、Facebook はユーザーを上記の YOUR_URL にリダイレクトします。

そこでリダイレクトを処理し、次のような方法でモバイル サービス ログインを実行できます。

function handleLoginResponse() {
    var frag = $.deparam.fragment();
    if (frag.hasOwnProperty("access_token")) {
        client.login("facebook", { access_token: frag.access_token }).then(function () {
            // you're logged in
        }, function (error) {
            alert(error);
        });
    } 
}

ここでは、取得したアクセス トークンを URL フラグメントとして解析し、Azure Mobile Services に対して行うログイン呼び出しに引数として渡します。

このコードは、URL フラグメントを簡単に処理するためにjquery BBQプラグインに依存しています。

これで問題が解決することを願っています!

于 2013-10-25T13:21:58.933 に答える