Question

我必须向我无法控制的外部API发出跨域请求。给定用户名和密码，将弹出一个允许发出请求的身份验证对话框。

当尝试进行AJAX调用时，对话框在所有浏览器中都能正确显示，但在IE和Safari中没有显示。在这些浏览器中，它以401静默失败，当您明确尝试在新选项卡中访问API URL时，仅显示对话框。然后你可以授权，电话会成功。

更改$ .ajax中的dataType会立即在Safari和IE中调用该对话框，但响应将被解析为脚本（JSONP），从而导致语法错误。

有什么方法可以在所有浏览器中获得以下行为，并以一致的方式工作：

1）当没有凭据进行调用时，应立即弹出HTTP Basic Auth对话框，要求提供用户名和密码 2）如果凭证有效，则应进行调用，并将响应解析为JS对象或字符串

这必须适用于OS X和Windows上的Safari，Chrome，IE和Firefox。

奖金问题：为什么Chrome和Firefox在没有dataType的情况下完美运行：jsonp，要求凭据并正确解析reaponse？

代码：

var printOutput = function(data) {
  var stringified = JSON.stringify(data, undefined, 2);
  $('.json').html(stringified);
};

var ajaxCallSettings = {
  url: URL,
  xhrFields: {
    withCredentials: true
  }
}

if(IE || SAFARI || IOS) ajaxConfigObj.dataType = 'jsonp';

$.ajax(ajaxCallSettings)
.then(function(data) {
  printOutput(data);
})
.fail(function(xhr, error) {
  printOutput(xhr);
});

这是HTML字段中的输出：

{
    "readyState": 4,
    "status": 200,
    "statusText": "load"
}

这些是标题：

请求

Referer: http://localhost:3000/
Host: xxx
Accept: */*
Connection: keep-alive
Accept-Encoding: br, gzip, deflate
Accept-Language: en-gb
DNT: 1
Authorization: Basic XXX
Cookie: XXX
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Safari/604.1.38

响应

Access-Control-Max-Age: 601
Content-Type: application/json
Access-Control-Allow-Credentials: true
Date: Mon, 02 Oct 2017 20:17:09 GMT
Cache-Control: no-transform, must-revalidate, proxy-revalidate
Access-Control-Allow-Methods: GET, POST, OPTIONS, HEAD
Server: Apache-Coyote/1.1
Access-Control-Expose-Headers: content-length
ETag: "gapplication/json-gzip"
Vary: Accept, Accept-Encoding
Access-Control-Allow-Origin: 
Content-Encoding: gzip
Access-Control-Allow-Headers: origin, host, referer, content-type, X-Requested-With

请注意，服务器的实际响应文本包含我想要的数据，但是采用JSON格式，而不是JSONP格式。

Safari＆amp;使用没有JSONP的基本HTTPS身份验证的IE CORS请求

0 个答案: