XHR请求将文件放在受.htaccess保护的文件夹中（Auth Basic）

Question

这个让我疯了。

围绕SO和非SO答案的圈子。

概述

使用 vanilla Javascript从 localhost 制作XHR（跨域） 远程 PHP脚本，它返回一个数组（JSON）。

文件

local.js

  var xhrGetArray = new XMLHttpRequest();
  var url = "https://example.com/ajax/target_script.php";
  var params = "t=" + Math.random();

  xhrGetArray.open("POST", url, true);  

  xhrGetArray.send(params);

的.htaccess

<ifModule mod_headers.c>
Header set Access-Control-Allow-Origin: http://thelocalhostname    
</ifModule>

target_script.php

<?php
header('Content-type: application/json');
echo json_encode($array_to_return);
exit;
?>

一切顺利，原点正常运作。

但是，我想密码保护（Auth Basic）文件所在的文件夹，提示用户输入或在XHR中发送Auth凭证。

当我将标准AUTH代码添加到.htaccess文件时：

AuthType Basic
AuthName "Restricted Area"
AuthUserFile "/path/to/.htpasswd"
require valid-user 

所以.htaccess变为：

AuthType Basic
AuthName "Restricted Area"
AuthUserFile "/path/to/.htpasswd"
require valid-user 

<ifModule mod_headers.c>
Header set Access-Control-Allow-Origin: http://thelocalhostname    
</ifModule>

然后我收到ORIGIN错误：（Chrome Dev）

No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://thelocalhostname' is therefore not allowed access. The response had HTTP status code 401

我尝试了以下内容：

将此添加到XHR（local.js）：

xhrGetOnlineOrders.withCredentials = true;
xhrGetOnlineOrders.setRequestHeader("Authorization", "Basic " + btoa("user:pass"));

手动输入验证凭据，然后尝试了请求

用这个圈子绕圈数小时，任何指导都会非常感激。

提前致谢。

更新

我试过了（感谢CBRoe - 我确实在我正在进行的圈子中的某个地方有它）将以下内容添加到.htaccess文件和 PHP文件中：

Header set Access-Control-Allow-Credentials: true

它仍然说：

No 'Access-Control-Allow-Origin' header is present

然而，SET HEADER出现在.htaccess

中

进一步更新

当我从.htaccess文件中删除AUTH代码时，来自服务器的响应包括＆＃34; origin＆＃34;数据

当我添加AUTH代码时，事情就失败了 - 由于某种原因，AUTH代码存在，服务器没有发送＆＃34; origin＆＃34;头回来。