我的后端检查用户是否有权使用以下代码上传资源:
<?php
if(!isset($_SESSION["id"])){
http_response_code(401);
die("Error. Unauthorized user.");
}
要使其正常工作,开发在angular.example.com:4200
上运行的角度应用程序需要将会话cookie跨域发送到example.com
。我通常通过在发送请求时启用{withCredentials:true}
来做到这一点。由于某些原因,当使用以下代码上传文件时,此操作将无效:
//no cookies sent in this example
import { HttpClient, HttpEventType } from '@angular/common/http';
//function
const fd = new FormData();
for (let i = 0; i < files.length; i++) {
let file = files[i] as File;
fd.append("myfile[]", files[i], files[i].name);
}
this.httpClient.post("https://example.com/upload.php", fd, { reportProgress: true, observe: "events", withCredentials: true }).subscribe((event) => {
console.log(event);
// show upload progress code here
});
服务器响应:
Access-Control-Allow-Credentials: true
Access-Control-Allow-Origin: https://angular.example.com:4200
Cache-Control: no-store, no-cache, must-revalidate
Connection: close
Content-Length: 25
Content-Type: text/html; charset=UTF-8
Date: Thu, 25 Oct 2018 13:29:04 GMT
Expires: Thu, 19 Nov 1981 08:52:00 GMT
Pragma: no-cache
Server: Apache/2.4.33 (Unix) OpenSSL/1.0.2n PHP/7.2.4 mod_perl/2.0.8-dev Perl/v5.16.3
Set-Cookie: PHPSESSID=9e03dc7c6c6a3ccd4d1d87a1af135b86; path=/
Vary: Origin
X-Powered-By: PHP/7.2.4
请求:
Accept: */*
Accept-Encoding: gzip, deflate, br
Accept-Language: en-US
Access-Control-Request-Method: POST
Connection: keep-alive
Host: example.com
Origin: https://angular.example.com:4200
User-Agent: useragenthere
在这种情况下,不发送任何cookie,但是如果我改用此代码,则不会正常发送它们:
//cookies are successfully sent
for (let i = 0; i < files.length; i++) {
let file = files[i] as File;
fd.append("myfile[]", files[i], files[i].name);
}
this.httpClient.post("https://example.com/upload.php", fd, { withCredentials: true }).subscribe((event) => {});
似乎多余的选项与withCredentials
混在一起。我该怎么做才能解决此问题?
这是我在example.com虚拟主机中的apache指令,该指令处理所有子域和端口的CORS:
SetEnvIf Origin ^(https?://.+\.example\.com(?::\d{1,5})?)$ CORS_ALLOW_ORIGIN=$1
Header append Access-Control-Allow-Origin %{CORS_ALLOW_ORIGIN}e env=CORS_ALLOW_ORIGIN
Header append Access-Control-Allow-Credentials true
Header merge Vary "Origin"