私はこれに真剣に困惑しているので、誰かが手がかりを提供できるなら、本当に感謝しています.
これが私のサイトです(レールに組み込まれています):http://floating-autumn-3174.herokuapp.com/
誰かが Facebook や Twitter のリンクからサイトにアクセスしようとすると、基本的に新しいタブが読み込まれますが、すぐに閉じます。これは Chrome でのみ発生します。Firefox で問題なく動作します。
リンクを右クリックして [新しいタブで開く] を選択すると、正常に読み込まれます。
リンクを右クリックしてコピーすると、問題なく動作します。
SSL リダイレクトのせいかもしれないと思っていましたが、ステージング環境 (SSL なし) でテストしたところ、問題なく動作しました。
基本的に、この自動終了は Chrome でのみ発生し、新しいタブをロードするリンクをクリックした場合にのみ発生します。
何が起こっているのか、またはこれをより適切にトラブルシューティングするにはどうすればよいですか?
編集
わかりました。含まれている JavaScript をさらに調べたところ、問題が見つかったと思います。これには、ポップアップを処理するために使用する JS が含まれます。まず、私たちが何をしようとしているのかを説明しましょう。Facebook経由で認証します。ユーザーが [Facebook 経由でサインイン] をクリックすると、ポップアップが起動して認証されます。成功すると、ポップアップが閉じ、メイン ウィンドウがサインイン状態で更新されます。これはすべて正常に機能しますが、ポップアップを閉じるコードが他のすべての新しいウィンドウを強制終了していることに気付きました。以下に完全なコード スニペットを示します。
function popupCenter(url, width, height, name) {
var left = (screen.width/2)-(width/2);
var top = (screen.height/2)-(height/2);
return window.open(url, name, "menubar=no,toolbar=no,status=no,width="+width+",height="+height+",toolbar=no,left="+left+",top="+top);
}
$(document).ready(function(){
$("a.popup").click(function(e) {
popupCenter($(this).attr("href"), $(this).attr("data-width"), $(this).attr("data-height"), "authPopup");
e.stopPropagation(); return false;
});
if(window.opener) {
window.opener.location.reload(true);
window.close()
}
});
最後のifステートメントは、問題の原因であると私が信じているものです。私は真面目な JS 初心者なので、これを修正する方法がわかりません。基本的に、リンクがポップアップ用である場合にのみ、最後の条件が発生するようにします。どうすればそれを行うことができますか?すべての助けをありがとう。
編集2
以下のRobの回答を進めて、それが機能していると思いましたが、実際には、助けを求めている1つのエッジケースに遭遇しました. どうやら、ユーザーが初めて Facebook 認証を通過すると、window.name はもはや「authPopup」ではなくなります。ポップアップは実際には複数のステップを経て、許可を求める画面で終了するためだと思います。このシナリオでは、ポップアップは閉じません。以降のログインでは、すべての手順を実行する必要がなく、「authPopup」条件が true のままであるため、ポップアップは閉じます。どうすればこれを処理できますか?
編集3
私はうまくいくと信じている解決策にたどり着きました。Rob の提案に従って、最初に Facebook 認証画面のウィンドウ名を調べましたが、毎回変化し、簡単に予測できないことがわかりました。そこで、代わりにグローバル変数ルートに進むことにしました。他の人が役に立つと思う場合に備えて、私が使用している最終的なコードを次に示します。
function popupCenter(url, width, height, name) {
var left = (screen.width/2)-(width/2);
var top = (screen.height/2)-(height/2);
popupValue = "on";
return window.open(url, name, "menubar=no,toolbar=no,status=no,width="+width+",height="+height+",toolbar=no,left="+left+",top="+top );
}
$(document).ready(function(){
$("a.popup").click(function(e) {
popupCenter($(this).attr("href"), $(this).attr("data-width"), $(this).attr("data-height"), "authPopup");
e.stopPropagation(); return false;
});
if(window.opener && window.opener.popupValue === 'on') {
delete window.opener.popupValue;
window.opener.location.reload(true);
window.close()
}
});