假设我有两台服务器:服务器 A 和服务器 B。服务器 A 托管以下页面:
<html>
<head>
<script type="text/javascript">
var http = new XMLHttpRequest();
console.log("XML Request object created.");
http.open("POST", 'https://serverb.com/file', true, 'user', 'pass');
http.onreadystatechange = function() {
console.log("readystatechange: "+http.status+":"+http.readyState);
if (http.status == 200 && http.readyState == 4) {
alert(http.responseText);
}
}
http.send();
console.log("http request sent.");
</script>
</head>
</html>
使用以下 Apache2 配置:
LoadModule ssl_module modules/mod_ssl.so
LoadModule headers_module modules/mod_headers.so
Listen 443
<VirtualHost *:443>
Header always append Access-Control-Allow-Origin: "*"
Header set Access-Control-Allow-Credentials true
ServerAdmin webmaster@localhost
DocumentRoot /var/www/html
ErrorLog ${APACHE_LOG_DIR}/error.log
CustomLog ${APACHE_LOG_DIR}/access.log combined
SSLEngine on
SSLCertificateFile "/home/vtcakavsmoace/Documents/webpass/cert.pem"
SSLCertificateKeyFile "/home/vtcakavsmoace/Documents/webpass/key.pem"
</VirtualHost>
服务器 B 托管一个名为"file"的文件并具有以下 Apache2 配置:
LoadModule ssl_module modules/mod_ssl.so
LoadModule headers_module modules/mod_headers.so
Listen 443
<VirtualHost *:443>
Header always append Access-Control-Allow-Origin: "*"
Header set Access-Control-Allow-Credentials true
ServerAdmin webmaster@localhost
DocumentRoot /var/www/files
ErrorLog ${APACHE_LOG_DIR}/error.log
CustomLog ${APACHE_LOG_DIR}/access.log combined
<Directory "/var/www/files">
AuthType Basic
AuthName "Restricted Content"
AuthUserFile /etc/apache2/.htpasswd
Require valid-user
</Directory>
</VirtualHost>
服务器希望对名为“user”且密码为“pass”的用户进行 HTTP 身份验证。
但是,每当有人连接到服务器 A 时,他们都会收到以下错误:
NS_ERROR_DOM_BAD_URI: Access to restricted URI denied
表示 Access-Control-Allow-Origin
不在 header 中。对于任何一台服务器,情况都不是这样。如果这不是问题,我还尝试通过命令行 curl 信息,结果成功了。我还尝试将 http.open
行更改为:
http.open("POST", 'https://user:pass@serverb.com/file', true);
但这也失败了。
我在这里做错了什么?
编辑:
如果有帮助,这里是 curl --verbose --head -u 'user:pass' https://serverb.com/file
的输出:
* Trying <redacted>...
* Connected to <redacted> (<redacted>) port 443 (#0)
* found 173 certificates in /etc/ssl/certs/ca-certificates.crt
* found 697 certificates in /etc/ssl/certs
* ALPN, offering http/1.1
* SSL connection using TLS1.2 / ECDHE_RSA_AES_128_GCM_SHA256
* server certificate verification OK
* server certificate status verification SKIPPED
* common name: <redacted> (matched)
* server certificate expiration date OK
* server certificate activation date OK
* certificate public key: RSA
* certificate version: #3
* subject: OU=<redacted>,OU=See www.rapidssl.com/resources/cps (c)15,OU=Domain Control Validated - RapidSSL(R),CN=<redacted>
* start date: Wed, 06 May 2015 13:02:37 GMT
* expire date: Mon, 08 May 2017 08:52:24 GMT
* issuer: C=US,O=GeoTrust Inc.,CN=RapidSSL SHA256 CA - G3
* compression: NULL
* ALPN, server did not agree to a protocol
* Server auth using Basic with user '<redacted>'
> HEAD /<redacted>/file HTTP/1.1
> Host: <redacted>
> Authorization: Basic <redacted>
> User-Agent: curl/7.47.0
> Accept: */*
>
< HTTP/1.1 200 OK
HTTP/1.1 200 OK
< Date: Wed, 10 Aug 2016 11:30:36 GMT
Date: Wed, 10 Aug 2016 11:30:36 GMT
< Server: Apache/2.4.7 (Ubuntu)
Server: Apache/2.4.7 (Ubuntu)
< Access-Control-Allow-Origin: *
Access-Control-Allow-Origin: *
< Last-Modified: Tue, 09 Aug 2016 11:36:29 GMT
Last-Modified: Tue, 09 Aug 2016 11:36:29 GMT
< ETag: "<redacted>"
ETag: "<redacted>"
< Accept-Ranges: bytes
Accept-Ranges: bytes
< Content-Length: 45377
Content-Length: 45377
< Access-Control-Allow-Credentials: true
Access-Control-Allow-Credentials: true
< Content-Type: application/<redacted>
Content-Type: application/<redacted>
<
* Connection #0 to host <redacted> left intact
编辑 2:
我进一步修改了代码。网页中的脚本现在如下:
var http = new XMLHttpRequest();
console.log("XML Request object created.");
http.open("POST", 'https://serverb.com/file', true);
http.withCredentials = true;
http.setRequestHeader('Authorization', 'Basic '+btoa('user:pass'));
http.onreadystatechange = function() {
console.log("readystatechange: "+http.status+":"+http.readyState);
if (http.status == 200 && http.readyState == 4) {
alert(http.responseText); }
}
http.send();
console.log("http request sent.");
现在,我得到的不是简单地拒绝请求,而是服务器端的 401 状态和客户端的 0 状态,这意味着凭据不正确,即使它们是正确的。
编辑 3:
以下编辑会在 Chrome 中打开身份验证面板,但在 Firefox 中会抛出 NS_ERROR_DOM_BAD_URI: Access to restricted URI denied
错误。
var http = new XMLHttpRequest();
console.log("XML Request object created.");
http.open("GET", 'https://serverb.com/file', true, 'user', 'pass');
http.withCredentials = true;
http.onreadystatechange = function() {
console.log("readystatechange: "+http.status+":"+http.readyState);
if (http.status == 200 && http.readyState == 4) {
alert(http.responseText);
}
}
http.send();
console.log("http request sent.");
请您参考如下方法:
好吧,我想出了一些解决方法。
由于 CORS 导致我出现 NS_ERROR_DOM_BAD_URI: Access to restricted URI denied
问题,我摆脱了 CORS 并开始在 Apache2 配置中转发请求。
index.html 最终版本:
<html>
<head>
<script type="text/javascript">
var http = new XMLHttpRequest();
console.log("XML Request object created.");
http.open("POST", 'file', true);
http.onreadystatechange = function() {
console.log("readystatechange: "+http.status+":"+http.readyState);
if (http.status == 200 && http.readyState == 4) {
alert(http.responseText);
}
}
http.send();
console.log("http request sent.");
</script>
</head>
</html>
服务器A最终配置:
LoadModule ssl_module modules/mod_ssl.so
LoadModule headers_module modules/mod_headers.so
LoadModule rewrite_module modules/mod_rewrite.c
LoadModule proxy_module modules/mod_proxy.so
LoadModule proxy_http_module modules/mod_proxy_http.so
LoadModule auth_basic_module modules/mod_auth_basic.c
Listen 443
<VirtualHost *:443>
Header always append Access-Control-Allow-Origin: "*"
Header set Access-Control-Allow-Credentials true
ServerAdmin webmaster@localhost
DocumentRoot /var/www/html
ErrorLog ${APACHE_LOG_DIR}/error.log
CustomLog ${APACHE_LOG_DIR}/access.log combined
SSLEngine on
SSLCertificateFile "/path/to/cert.pem"
SSLCertificateKeyFile "/path/to/key.pem"
ProxyRequests Off
<Proxy *>
Order deny,allow
Allow from all
</Proxy>
SSLProxyEngine On
SSLProxyCheckPeerCN on
SSLProxyCheckPeerExpire on
# Adding a prefix for googling purposes.
ProxyPassMatch "^/(prefix.*file.*.jpg)$" "https://serverb.com/$1"
ProxyPassReverse "/" "https://serverb.com/"
<LocationMatch "^/prefix.*file.*.jpg$">
# Pass the credentials
AuthBasicFake "user" "pass"
Order allow,deny
Allow from all
</LocationMatch>
</VirtualHost>
服务器 B 最终配置:
LoadModule ssl_module modules/mod_ssl.so
LoadModule headers_module modules/mod_headers.so
Listen 443
<VirtualHost *:443>
Header always append Access-Control-Allow-Origin: "*"
Header set Access-Control-Allow-Credentials true
ServerAdmin webmaster@localhost
DocumentRoot /var/www/files
ErrorLog ${APACHE_LOG_DIR}/error.log
CustomLog ${APACHE_LOG_DIR}/access.log combined
<Directory "/var/www/files">
AuthType Basic
AuthName "Restricted Content"
AuthUserFile /etc/apache2/.htpasswd
Require valid-user
</Directory>
</VirtualHost>
此方法的另一个好处是最终用户永远不会看到密码,因此不会泄露授权。