1

我正在开发 Angular 4 应用程序，其中，我需要在表单提交时上传文件，为此我使用 ng2-file-upload 插件。但是我在上传文件时遇到了问题。我正在创建一个upload.php 文件来完成上传过程。upload.php 如下：

header("Access-Control-Allow-Origin: http://localhost:4200");
header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");

if ($_SERVER['REQUEST_METHOD'] !== 'POST') {
  echo json_encode(array('status' => false));
  exit;
}

$path = 'uploads/';

if (isset($_FILES['file'])) {
$originalName = $_FILES['file']['name'];
$ext = '.'.pathinfo($originalName, PATHINFO_EXTENSION);
$generatedName = md5($_FILES['file']['tmp_name']).$ext;
$filePath = $path.$generatedName;

if (!is_writable($path)) {
  echo json_encode(array(
    'status' => false,
    'msg'    => 'Destination directory not writable.'
   ));
   exit;
 }

if (move_uploaded_file($_FILES['file']['tmp_name'], $filePath)) {
   echo json_encode(array(
     'status'        => true,
     'originalName'  => $originalName,
     'generatedName' => $generatedName
   ));
 }
}
else {
  echo json_encode(
    array('status' => false, 'msg' => 'No file uploaded.')
  );
 exit;
 }

但我有以下错误：

加载http://localhost/uploads/uploads.php失败：对预检请求的响应未通过访问控制检查：响应中“Access-Control-Allow-Credentials”标头的值是“”，必须是当请求的凭据模式为“包含”时为“真”。因此，不允许访问源“ http://localhost:4200 ”。XMLHttpRequest 发起的请求的凭证模式由 withCredentials 属性控制。

如果有任何帮助，请建议我，提前谢谢！

4

1 回答 1

-1

这是浏览器安全问题，而不是 Angular。当你发出一个跨域的 AJAX 请求时，如果你想发送 cookie（基本上是授权信息），浏览器要求你指定一个Access-Control-Allow-Credentialswith true，表示外部域允许这样做。这两个标头的原因是因为站点可能允许来自另一个域的 AJAX 请求，但也许他们不希望该域在浏览器中使用任何潜在的授权 cookie。

作为这种风险的一个例子，您可以编写一个应用程序来通过 AJAX 访问 Facebook 的 API。但是，如果 Facebook 允许您发送浏览器中可能存在的 cookie，您就可以像经过身份验证的用户一样进行发布，这当然是不允许的。通过阻止发送现有的 cookie，用户应该必须向您的应用提供他们的 Facebook 凭据才能以他们的名义做某事。

Access-Control-Allow-Origin作为此检查的补充，如果设置为“*” ，则通过 XMLHttp 发送 cookie 也不起作用。必须明确添加域，以确保您不会授予对潜在危险站点的访问权限。

于 2018-03-15T09:54:46.683 回答