在 Cordova / Ionic iOS 应用程序中使用 WWW-Authenticate 处理 HTTP 401答案

【问题标题】：Handling HTTP 401 with WWW-Authenticate in Cordova / Ionic iOS application在 Cordova / Ionic iOS 应用程序中使用 WWW-Authenticate 处理 HTTP 401
【发布时间】：2015-08-12 07:09:39
【问题描述】：

我目前正在开发基于 Cordova 和 Ionic 的移动应用。我正在处理第三方 API（即它不能，也不会为了这个应用程序工作而改变）。

当应用程序的用户未经身份验证时 - 无论他们的会话是否已过期 - API 都会以 HTTP 401 和 WWW-Authenticate 标头进行响应。

在浏览器中开发时这很好，但在 iPhone 上或在模拟器中它不会出现，并且应用程序必须达到请求的超时期限。当达到该超时时，请求被取消。这意味着在 JavaScript 中，我们只是返回一个 0 的 HTTP 状态，没有真实数据来确定是否存在超时或身份验证问题。

目前，我已经进行了一些有根据的猜测，例如在发生超时时检查手机是否有连接等，但这不是一个理想的解决方案，因为用户仍然必须等待超时，而且并不总是正确的.

如何检查 HTTP 401 对话框何时出现并等待响应？我需要能够识别实际 401 何时发生，以及请求何时超时。

如果 JavaScript 中有一个方法可以实现，那就太好了。原生解决方案也可以，无论是插件还是其他方式。

【问题讨论】：

标签： javascript ios objective-c cordova ionic

【解决方案1】：

我现在正在处理同样的问题。

问题在于，当返回 401 时，它有一个 WWW-Authenticate 片段，它告诉浏览器弹出那个小弹出窗口让您重试。这在 iOS Web 容器中没有“正确”处理（取决于你问我猜的是谁），这导致 Cordova 永远看不到请求。科尔多瓦错误记录在这里：https://issues.apache.org/jira/browse/CB-2415

我不明白这么大的问题怎么还没解决。但我确信它有一些技术细节。如果您查看更新，您会看到 Tobias Bocanegra (https://github.com/tripodsan/cordova-ios/commit/5f0133c026d6e21c93ab1ca0e146e125dfbe8f7e) 添加了“快速破解”来解决问题。也许这可以进一步帮助您。这对我的情况没有帮助。

在我的情况下我为临时修复做了什么：我将 http 请求传递到具有取消按钮的加载模式中。因此，由用户决定是取消还是等待。这很可怕，但它在我的情况下有效。（内部应用等）

【讨论】：

【解决方案2】：

我不确定为什么第三方 API 不会向您发送正常的 HTTP 错误代码。如果您使用 $http 连接到 API，您可以向其添加响应拦截器，例如阅读下一篇文章：

http://codingsmackdown.tv/blog/2013/01/02/using-response-interceptors-to-show-and-hide-a-loading-widget/

在下一个错误处理程序代码中，您可以添加一些代码来评估 HTTP 状态代码：

function error(response) {
    // Added code for specific HTTP error codes
    if (response.status === 401) {
        console.log('Received 401');
    }

    // get $http via $injector because of circular dependency problem
    $http = $http || $injector.get('$http');
    if($http.pendingRequests.length < 1) {
        $('#loadingWidget').hide();
    }
    return $q.reject(response);
}

另见AngularJS documentation about interceptors。

【讨论】：

在正常工作的常规浏览器中，正如我所尝试的那样 - 但是，在手机上，在应用程序中，我们永远不会被提示输入 401 中的详细信息，因此请求结束达到超时，并被取消。拦截器在请求完成之前不会触发。到那时，它已经超时了，我们只剩下状态 0。状态 0 可能来自 real 超时，或者像这样的身份验证失败......甚至可能是其他原因。

【解决方案3】：

原生解决方案也可以，无论是插件还是其他方式。

我遇到了同样的问题，我可以使用 cordova http 插件 解决它。只需通过ionic plugin add cordova-plugin-advanced-http (check documentation here) 安装它。然后您的 xhttp 调用将在本机中完成，而不是在 webView 之外。然后带有“WWW-Authenticate”标头的响应将不再超时，您可以正确处理401

您可以像这样在代码中使用它：

try { // important since it will not work in dev mode in your browser (e.g. chrome)
    if (cordova && cordova.plugin && cordova.plugin.http) {

        var server_url = 'https://example.com';
        var your_endpoind = '/auth-me-example';

        cordova.plugin.http.useBasicAuth('some_user', 'and_password');
        cordova.plugin.http.setHeader(server_url, 'Content-type', 'application/json');

        cordova.plugin.http.get(server_url + your_endpoind, {}, {}, function (response) {
            console.log('response: ', JSON.stringify(response));
        }, function (response) {
            console.error('error response: ', JSON.stringify(response));
        });
    }
} catch (e) {
    console.error('could not make native HTTP request!');
}

PS：如果你使用 angular2+ npm install --save @ionic-native/http 也很有用。

【讨论】：