ios - InAppBrowser OAUTH didFailLoadWithError 1004 "Could not connect to the server." "<allow-navigation> not set for url"

Question

我看到这个问题类似于另一个问题 ( webView:didFailLoadWithError -1004: Could not connect to the server while connecting google plus in Phonegap ios ) ，但有些不同，因为我逐行检查了代码并且它在做同样的事情，但它仍然不适合我.也许还因为我使用的是不同的版本:iPhone 5S 上的 iOS 9.3.2、Cordova 6.1.1 和 cordova-plugin-inappbrowser 1.3.0。

我的代码在 Android 上运行良好，但在 iPhone 上运行不佳。代码如下:

    var googleapi = {
    authorize: function(options) {
        var deferred = $.Deferred();
        var authUrl = GOOGLE_CLIENT_API_URL + $.param({
            client_id: options.client_id,
            redirect_uri: options.redirect_uri,
            response_type: 'code',
            scope: options.scope
        });
        console.log("authUrl: " + authUrl);
        var authWindow = window.open(authUrl, "_blank", "location=no,toolbar=no");  // for iOS add 'toolbar=no'

        //The recommendation is to use the redirect_uri "urn:ietf:wg:oauth:2.0:oob" 
        //which sets the authorization code in the browser's title. However, we can't 
        //access the title of the InAppBrowser. 
        // 
        //Instead, we pass a bogus redirect_uri of "http://localhost", which means the 
        //authorization code will get set in the url. We can access the url in the 
        //loadstart and loadstop events. So if we bind the loadstart event, we can 
        //find the authorization code and close the InAppBrowser after the user 
        //has granted us access to their data. 
        //
        // To clear the authorization, go to https://accounts.google.com/IssuedAuthSubTokens.
        $(authWindow).on('loadstart', function(e) {
            var url = e.originalEvent.url;
            var code = /\?code=(.+)$/.exec(url);
            var error = /\?error=(.+)$/.exec(url);

            if(code || error) {
                authWindow.close();
            }
            if (code) { 
                //Exchange the authorization code for an access token 
                $.post('https://accounts.google.com/o/oauth2/token', { 
                    code: code[1], 
                    client_id: options.client_id, 
                    client_secret: options.client_secret, 
                    redirect_uri: options.redirect_uri, 
                    grant_type: 'authorization_code' 
                }).done(function(data) {
                    // use the token we got back from oauth to setup the api.
                    gapi.auth.setToken(data);
                    // load the drive api.
                    loadDriveApi();
                    deferred.resolve(data); 
                }).fail(function(response) {
                    console.log("Posting code to Google failed.  No OAuth token will be returned.");
                    deferred.reject(response.responseJSON); 
                }); 
            } else if (error) { 
                //The user denied access to the app 
                console.log("Error retrieving code from Google.");
                deferred.reject({ 
                    error: error[1] 
                }); 
            } 
        });

        return deferred.promise();
    }
};

function checkAuth() {
    if(device.platform === 'browser') {
        console.log("calling gapi.auth.authorize()");
        gapi.auth.authorize(
        {
            'client_id' : CLIENT_ID,
            'scope' : SCOPES.join(' '),
            'immediate' : true
        }, handleAuthResult);
    } else {
        // because this is called only after deviceready(), InAppBrowser is initialized by now:
        console.log("using the InAppBrowser plugin to authenticate.");
        window.open = cordova.InAppBrowser.open;

        googleapi.authorize(
        {
            'client_id' : CLIENT_ID,
            'client_secret' : CLIENT_SECRET,
            'redirect_uri' : REDIRECT_URI,
            'scope' : SCOPES.join(' ')
        }, handleAuthResult);
    }
}

/**
 * Handle response from authorization server.
 *
 * @param {Object} authResult Authorization result.
 */
function handleAuthResult(authResult) {
    var authMenuItem = document.getElementById("menuitemenablegoogledrivebackup");
    if (authResult && !authResult.error) {
        // If already authorized, change menu option to allow user to deny Authorization
        authMenuItem.innerHTML = l("Disable Google Drive Backup");
        loadDriveApi();
    } else {
        alert("Authorization Error: " + authResult.error);
        console.log("inside handleAuthResult, authResult.error: " + authResult.error);

        // Show auth menu item, allowing the user to initiate authorization
        authMenuItem.innerHTML = l("Enable Google Drive Backup");
        // use the InAppBrowser to display the authorization window:
        // var authWindow = window.open(authUrl, '_blank', 'location=no,toolbar=no');
        // or?
        // gapi.auth.authorize(
        //  {
        //      client_id: CLIENT_ID,
        //      scope: SCOPES.join(' '),
        //      immediate: false
        //  }, handleAuthResult)
    }
}

/**
 * Load Drive API client library.
 */
function loadDriveApi() {
    try {
    gapi.client.load('drive', 'v2', null).then(function(resp) {
        console.log("Google Drive API v2 loaded successfully.");
    }, function(reason) {
        alert('Google Drive API v2 FAILED to load: ' + reason.result.error.message);
        console.log('Google Drive aPI v2 FAILED to load: ' + reason.result.error.message);
    });
    } catch(err) {
        alert(err.message);
        console.log("Google Drive API v2 FAILED to load.  Exception: " + err.message);
    }
}

从调试中，我看到 Android 版本调用 window.open() 调用，它首先通过 loadstart 处理程序一次，使用原始 URL，但它不包含代码，也没有错误，所以它只是通过.然后 redirect_url 出现，在第二次调用 loadstart 处理程序时(这是由 InAppBrowser 调用的吗？)但是这次它有更短的 redirect_url 并附加了代码，因此该代码随后成功用于获取“$”上的 token .post”调用。但是，在 iOS 上，没有对 loadstart 处理程序的第二次调用。

当我在 Chrome 调试器中运行它时，我没有收到任何错误，只是无提示的失败。在 XCode 调试器中，我收到如下错误:

2016-06-09 20:47:27.014 APass2[675:398271] Setting the WebView's frame to {{0, 0}, {320, 524}} 2016-06-09 20:47:27.015 APass2[675:398271] Setting the WebView's frame to {{0, 0}, {320, 568}} 2016-06-09 20:47:27.026 APass2[675:398271] THREAD WARNING: ['InAppBrowser'] took '39.259033' ms. Plugin should use a background thread. 2016-06-09 20:47:27.749 APass2[675:398271] webView:didFailLoadWithError - -1004: Could not connect to the server. 2016-06-09 20:47:28.955 APass2[675:398271] ERROR Internal navigation rejected - not set for url='https://content.googleapis.com/static/proxy.html?jsh=m%3B%2F_%2Fscs%2Fapps-static%2F_%2Fjs%2Fk%3Doz.gapi.en.joG9nQvYxYQ.O%2Fm%3D__features__%2Fam%3DAQ%2Frt%3Dj%2Fd%3D1%2Frs%3DAGLTcCPyXDgCg_S7GlvvvMpztuAZ6V0pEA#parent=file%3A%2F%2F&rpctoken=1268129019'

我的成功或失败回调都没有被调用。

求助!!!我现在彻底迷失了。

谢谢， 爱德华

Answer 1

首先，通过查看InAppBrowser文档，我了解到还有一个“loaderror”事件。仅在 iOS 上，对 inAppBrowser.open() 的调用会导致调用“loaderror”处理程序。在“loaderror”处理程序中，我还能够获取 url，就像原始代码在“loadstart”上所做的那样。在 Chrome 和 Safari 中同时调试，我可以看到“loaderror”中的 url 与“loadstart”处理程序中的完全相同，并且代码和错误的解析工作方式完全相同。所以，在第一次剪辑中，我以这种方式破解了它并进入了下一个阶段(某种程度上是成功的)。然后我遇到了另一个与 <access-navigation> 有关的错误.通过谷歌搜索，我发现项目根目录下的 config.xml 中有一个可用的配置设置。

更多的谷歌搜索将我指向一个说使用 <allow-navigation href="*" /> 的人。

显然，我对这么大的安全漏洞并不满意。

因此，最重要的是，我需要将 Google api 需要访问的 url 添加到 config.xml 文件，如下所示:

<allow-navigation href="https://accounts.google.com/*" />
<allow-navigation href="https://content.googleapis.com/*" />

我仍然需要清理代码，并可能简化“loaderror”处理程序中的错误处理，但我现在已经开始工作了!

最令人沮丧的是，这个设置在 Android 上根本没有必要，所以我没有理由怀疑这是问题所在。

感谢那些花时间查看此内容的人!

爱德华