如何使用带有 JQuery 的书签发送 403 身份验证标头，作为跨域请求 (CORS)？

Question

所以我有一个在其他网站上执行 javascript 的小书签，我想触发一个 403 Authentication Required 标头，一旦它上面的 Cache 按钮被点击。这样，就会出现提示要求他们登录。

问题是我不打算为我正在发出的 ajax 请求提供身份验证标头，同时将 Access-Control-Allow-Origin: 设置为具有 * 值的任何域。我应该明确定义要允许 403 身份验证标头出现在哪个域上，但我不能。

这是我的代码。

.htaccess

header set Access-Control-Allow-Origin: *
#header set Access-Control-Allow-Methods: GET, POST, PUT, DELETE
header set Access-Control-Allow-Headers: Authorization

JQuery

$.ajax({
            headers : {
                "Authorization" : "Basic TVNF3TQtU1BGMjAx6C12bVxzbW4ydHBvaW50OlF3Z5J0eSEyM6Q1"
            },
            type: "GET",
            url: 'http://desbest.uk.to/clickrobot/favicon.png', //image for testing
            crossDomain:true,
            xhrFields: {
                withCredentials: true
            }, 
            //contentType: "application/json; charset=utf-8",
            //dataType: "json",
            success: function(data) {
                alert('ok!');
                //formatData(format_type,data);
            },
            error: function(jqXHR, textStatus, errorThrown) {
                alert(textStatus + ' / ' + errorThrown);
            }
        }); 

我得到的错误

凭据时不能在 Access-Control-Allow-Origin 中使用通配符 标志为真。

我已经看到 Diigo 小书签可以做到这一点，所以这是可能的，但是怎么做呢？有可能吗？

Answer 1

让我们来看看documentation。有两点需要注意：

...浏览器将拒绝任何没有 Access-Control-Allow-Credentials: true header...

和

重要提示：在响应凭据请求时，服务器必须指定域，并且不能使用通配符。

您应该返回的标题是：

Access-Control-Allow-Origin: [some_origin]
Access-Control-Allow-Credentials: true 

您可以通过使用服务器脚本获取Referer 来返回第一个标头，从Referer 检索来源，然后将标头与您的脚本一起返回。在 PHP 中我们可以这样做：

$urllist = parse_url($_SERVER['HTTP_REFERER']);
$origin = $urllist['scheme'] . '://' . $urllist['host'];
header("Access-Control-Allow-Origin: " . $origin);

更新： 你应该阅读Access-Control-Allow-Origin Multiple Origin Domains，尤其是这个answer。如果您可以访问您的 httpd.conf，您可能不需要 PHP 文件

无论如何，您的网址不应该是图片，而是您的 PHP 脚本的网址。

url: 'http://desbest.uk.to/clickrobot/somescript.php'

在您的 php 脚本中，您检索请求的来源（这将是出现小书签的页面。然后您可以输出带有来源的标题。无论小书签出现在哪里，它都应该始终与正确的标题。

我不完全确定授权对话框是否会使用 Ajax 弹出，即使您指定了正确的标题。所以，这就是为什么我们将在下面看看 Diigo。

---

Diigo 使用不同的方法，即：一旦单击“登录”，JSONP 将用于请求由其服务器上的服务器端脚本（例如 PHP）生成的 javascript 文件。 JSONP 是 CORS 的替代方案。与 Ajax 请求不同，不同的 JavaScript 文件可以包含在页面的标题中，完全没有问题。

如果用户未登录，则请求 javascript 文件会发送一个 401 标头，在该标头上显示身份验证对话框（这是服务器端脚本中的 coded！）。用户输入他/她的详细信息，并根据输入的信息返回 javascript 文件的内容。如果用户成功登录，它可能会返回类似callback({ signedin : 1}) 的内容，否则返回callback({ signedin : 0})。

现在调用带有某些参数的javascript函数回调。如果用户已登录，我们会显示小书签的内容。

---

在您的 htaccess 中添加什么： 未经测试，但您希望允许所有来源并将“Access-Control-Allow-Origin”标头设置为来源的值。我相信这应该可以解决问题：

SetEnvIf Origin "^(.*)$" ORIGIN_DOMAIN=$1
Header set Access-Control-Allow-Origin "%{ORIGIN_DOMAIN}e" env=ORIGIN_DOMAIN