为跨域文件上传设置响应 header 和请求 header

Question

我正在尝试将文件从 localhost:8888 上传到 www.base.com。上传开始时出现此错误

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote 
resource at http://base.com/public_upload. (Reason: missing token 'x-file-name' 
in CORS header 'Access-Control-Allow-Headers' from CORS preflight channel).

这是我设置的 php 服务器的 header 响应

header('Access-Control-Allow-Origin: http://localhost:8888');
header("Access-Control-Allow-Methods: GET, POST, OPTIONS, PUT, DELETE");
header("Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept");

这是上传脚本中的请求 header，它在 localhost:8888

托管的浏览器中运行

xhr.setRequestHeader("Content-Type", "multipart/form-data"); 
xhr.setRequestHeader("X-File-Name", unescape(encodeURIComponent(file.name)));
xhr.setRequestHeader("X-File-Size", file.size);
xhr.setRequestHeader("X-File-Type", file.type);

我header可以mis-configed创建这样的错误消息吗？

Answer 1

您必须将 X-File-Name、X-File-Size 和 X-File-Type 添加到 header 的列表中：

header("Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept, X-File-Name, X-File-Size, X-File-Type");

删除 Access-Control-Allow-Headers header 应该也有效。

为跨域文件上传设置响应 header 和请求 header

Set response header and request header for cross domain file upload

javascript

php

xmlhttprequest

cross-domain