使用 ng2-file-upload 上传文件时出现 404（未找到）错误

Question

我正在使用 ng2-file-upload 将文件上传到我的 angular2 应用程序。问题是，当我单击“上传”按钮时，我收到 404（未找到）错误，这意味着我为上传设置的目录未找到。 这是我的组件：

import { Component } from '@angular/core';
import { FileUploader } from 'ng2-file-upload';

const URL = 'http://localhost:4200/src/app/uploads/';

@Component({
  selector: 'upload-file',
  templateUrl: 'upload-file.html'
})
export class UploadCvComponent {
  uploader: FileUploader = new FileUploader({ url: URL });
  hasBaseDropZoneOver: boolean = false;
  hasAnotherDropZoneOver: boolean = false;

  fileOverBase(e: any): void {
    this.hasBaseDropZoneOver = e;
  }

  fileOverAnother(e: any): void {
    this.hasAnotherDropZoneOver = e;
  }
}

我在 /src/app/uploads/ 创建了一个用于保存上传文件的目录。我还需要做些什么才能让它工作，或者 FileUploader 应该完成剩下的工作吗？ 我相信我得到的错误是因为我正在为 Angular2 应用程序使用路由器，并且该 URL (http://localhost:4200/src/app/uploads/) 未在路由器中定义。

有人可以建议吗？ 非常感谢！

Answer 1

应将常量 URL 替换为将接收和处理上传文件的后端应用 (URL:Port)。

如果您使用的是 file-catcher.js 示例，正确的应该是：

const URL = 'http://localhost:3000/api/

---- x ----

文件夹demo\src\app\components\file-upload里面有3个文件：

simple-demo.html 
simple-demo.ts 
file-catcher.js 

这个 file-catcher.js 是一个用于处理您的上传请求的后端的示例代码。要使其运行，您需要 Node.js。所以基本上，你必须打开一个终端，转到这个文件夹并执行 node file-catcher.js（第一次使用 npm 安装所有依赖项）。这将创建一个在端口 3000 上运行的服务器，该服务器将接收 Angular 上传请求并保存文件（在这种情况下，在文件夹 uploads 内 - 确保对其授予正确的权限）。

这里有一个步骤，希望对你有所帮助： https://www.thepolyglotdeveloper.com/2016/02/upload-files-to-node-js-using-angular-2/