web-dev-qa-db-ja.com

FB.loginダイアログがGoogleで閉じないChrome

アプリケーションのクリックイベントでFB.login()を呼び出しています。ダイアログは期待どおりにポップアップしますが、ユーザーがFacebookへのログイン（および/またはアプリの認証）を完了すると、ダイアログは閉じません。代わりに、ダイアログ内の白いページが読み込まれ、タイトルがXD Proxyに変わります。

これはGoogleでのみ発生しますChrome（Windows 7で現在利用可能な最新バージョンを使用しています）。

Chrome=がシークレットモードの場合、これは発生しません。

Fb-login 'ソーシャルプラグイン'はChromeで正常に動作します。

これをさらにテスト/デバッグするために、私はバニラ設定で新しいFacebookアプリを作成しました。私が行った唯一の変更は、アプリの設定でサイトのURLを設定したことです。このバグを再現するために使用できるHTMLコードを次に示します。

問題を再現するためのサンプルコード

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Chrome Bug Test</title>
    </head>
    <body>
        <button onclick="dologin()">Login using Facebook</button>

        <div id="fb-root"></div>
        <script src="http://connect.facebook.net/en_US/all.js"></script>
        <script>
          FB.init({
            appId  : '[YOUR APP ID HERE]',
            status : true, // check login status
            cookie : true, // enable cookies to allow the server to access the session
            xfbml  : true  // parse XFBML
          });
        </script>

        <script type="text/javascript">
            function dologin(){
                FB.login(function(r){
                    if(console && console.log) {
                        console.log(r);
                    }
                });
            }
        </script>

    </body>
</html>

変更してみたFacebook設定

  1. サイトドメインを設定しても、何も変更されませんでした。
  2. カスタムのchannelUrlとchannelファイルを使用しても、助けにはなりませんでした。

Facebookで追跡される関連バグ

Stack Overflowの関連する問題

多くの人がこれに遭遇するのを見てきましたが、このバグの具体的な修正を見つけることができなかったことが、私のバグです。 Facebookはまだバグレポートに対応していません。 1つの解決策は、JavaScriptベースの認証コードを削除し、サーバーサイドメカニズム（Facebook PHP SDK）のみを使用してそれを実行することです。時間制限のためにそれを回避したいと思います。

誰でもこれを修正する方法を知っていますか？

facebookgoogle-chromelogin
41
Jaffer

FB.initの後でこのスニペットを呼び出すと、問題が解決しました。しかし、他のソリューションがさまざまなケースで機能しているようです。

$.browser.chrome = /chrome/.test(navigator.userAgent.toLowerCase());
if ($.browser.chrome || $.browser.msie) {
    FB.XD._Origin = window.location.protocol + "//" + document.domain + "/" + FB.guid();
    FB.XD.Flash.init();
    FB.XD._transport = "flash";
  } else if ($.browser.opera) {
    FB.XD._transport = "fragment";
    FB.XD.Fragment._channelUrl = window.location.protocol + "//" + window.location.Host + "/";
  }
2
Jaffer

FB.login()を同様に呼び出して、次のように変更してダイアログボックスを閉じます

onclick="dologin()"

に

onclick="dologin(); return false;"
11
Joe Rantala

この投稿の年齢を考えると、ポスターがこれを解決したと思いますが、これは同様の問題を解決するために検索している他の人のためのリソースでもあるので、念のために自分の経験を含めたいと思いました。

これと同じ問題の症状を引き起こしている原因は、誤ってevent.preventDefault();をjQueryの「クリック」リスナーハンドラーに含めるのを忘れていることでした。 Facebookのログインダイアログがポップアップし、ログインはできましたが消えることはありませんでした。問題は、ウェブサイトがデフォルトのフォーム投稿アクションを実行しており、それがFacebookのコールバック機能を妨害していたことでした。

7
Chris Reedy

私も同じ問題を抱えていました。 2つのことを行いました。最初に、FB.init()を呼び出す直前にこの行を追加しました。

FB.Flash.hasMinVersion = function () { return false; };

次に、FBアプリのページに移動して、サイトドメイン（test.comなど）を追加しました。

サイトのドメイン設定が鍵だったと思いますが、100％ポジティブではありません。私が知っているのは、Chromeを含むすべてのブラウザーで常に閉じているように見えることです。

6
John Siladie

上記の質問に関する短い回答：

all.jshttps上のスクリプト。

<script src="https://connect.facebook.net/en_US/all.js"></script>

元の質問と同様の問題をトラブルシューティングしている場合は、より長い回答：

Google Chrome=を使用してログインを試みます。ログインして、空白のポップアップウィンドウが画面に表示されたら、 F12。これにより、Chromeのデベロッパーツールが表示されます。 [コンソール]タブをクリックすると、エラーが表示されるはずです。おそらく表示されるのは、XD（クロスドメイン）の問題に関連しています。

あなたの特定の問題が私が抱えていた問題と異なっていても、上記は正しい方向にあなたを導くはずです。

私の問題/解決策は特定のものでしたFacebook C＃SDK v6ドキュメント-チュートリアルコードはall.js//で始まるURLを使用したスクリプト-次に、私のサイトと同じスキームからスクリプトをロードします（ http）。ログインした後、ポップアップでhttps Facebookログインからhttpサイトとビンゴにリダイレクトしようとしましたが、XDの問題があります。解決策は、https://connect.facebook.net/en_US/all.jsからスクリプトを具体的にロードすることでした続く：

  // Load the SDK Asynchronously
  (function(d){
     var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
     if (d.getElementById(id)) {return;}
     js = d.createElement('script'); js.id = id; js.async = true;
     js.src = "https://connect.facebook.net/en_US/all.js";
     ref.parentNode.insertBefore(js, ref);
   }(document));

編集：

いくつかの検討の後、httpへのリダイレクトを許可するこのアプローチは、その要求内のデータを他の誰かが読み取ってから再利用できるようにすることで、システムのセキュリティを危険にさらす可能性があります。関連するドキュメントや例を見つけることができなかったため、YMMVという方法で結論を出すことはできませんでした。

5
umbyersw