檢測用戶在使用gapi.auth.authorize時是否關閉彈出窗口

Question

使用gapi.auth.authorize函數，用戶可以關閉彈出窗口而不單擊任何選項（不接受或拒絕按鈕）。 當這種情況發生時，我的回調函數不會觸發，所以我無法處理這種情況。 解決這種情況的方法是什么？

謝謝。

Answer 1

他們似乎沒有在任何文檔中提及它，但gapi.auth.authorize()返回彈出Window 。 因此，您可以保存返回的Window並設置間隔或超時以檢查Window.closed 。

Answer 2

所以你從谷歌的auth功能返回承諾 ，而不是窗口。 但是你可以將原始窗口包裝到函數中，該函數將設置間隔，以檢查打開的窗口是否已經關閉。

// variable to store our deferred object
var authDefer = null;

function auth() {

    // right before the auth call, wrap window.open
    wrap();
    // Call auth
    authDefer = window.gapi.auth.authorize({
        client_id: ...,
        scope: ...,
        immediate: ...
    }).then(
        // onSuccess,
        // onReject,
        // onNotify
    );
}

function wrap() {
    (function(wrapped) {
        window.open = function() {
            // re-assign the original window.open after one usage
            window.open = wrapped;
            var win = wrapped.apply(this, arguments);
            var i = setInterval(function() {
                if (win.closed) {
                    clearInterval(i);
                    if (authDefer) {
                        authDefer.cancel();
                    }
                }
            }, 100);
            return win;
        };
    })(window.open);
}

摘自谷歌論壇上的一個主題。 真的有用。

Source的外部鏈接

Answer 3

這個問題已經存在了一段時間，但是當我調查這個問題時（我希望在谷歌身份驗證窗口打開時顯示一個微調器，如果用戶決定不進行身份驗證則隱藏它），並發現gapi正在拋出一個問題錯誤popup_closed_by_user 。 在投擲之前有兩秒鍾的延遲（有點長，Facebook是即時的），但確實有效。 萬歲，谷歌！

一些示例代碼（angular 1.x）， prompting是顯示微調器的屬性：

_google_obj.prompting = true;
gapi.auth2.getAuthInstance().signIn().then(function(googleResponse){
    var token = googleResponse.getAuthResponse().id_token;
    SVC_exec_.post('/q/goog', 1000, { token: token }, 'signing you in through Google', function (response) {
        if (response.code === 'ok') {
            // update the UI
        }
        _google_obj.prompting = false;
    });
}, 
function(error){
    $timeout(function () {
        console.log('user probably closed the google popup window: '+error);
        _google_obj.prompting = false;
    });
});