Angular 将未定义的文件发布到 nestjs 控制器答案

【问题标题】：Angular posts an undefined file to nestjs controllerAngular 将未定义的文件发布到 nestjs 控制器
【发布时间】：2022-03-04 18:19:31
【问题描述】：

我正在尝试将文件从 Angular 应用程序上传到 nestjs 后端，但控制器得到了一个未定义的文件。这是 Angular 文件服务：

    async create(file: File): Promise<string> { 
        // With console.log I can see file is defined
        // file comes directly from the input file (event.target.files[0])
        const formData: FormData = new FormData();
        formData.append('file', file);

        let headers = new HttpHeaders();
        headers = headers
            .set(
               'Content-Type',
               `multipart/form-data; boundary=-----${guid.v4()}`
            )
            .set('Accept', 'application/json');

        return await this.http.post<string>('/api/files', formData, { headers }).toPromise();
    }

这是控制器方法：

    @Post()
    @UseInterceptors(FileInterceptor('file'))
    async create(@UploadedFile() file: any) {
        return await this.files.create(file.buffer);
    }

http 拦截器说：TypeError: Cannot read property 'buffer' of undefined。我尝试使用邮递员上传文件并且它有效，我想我在我的角度代码中遗漏了一些东西。

【问题讨论】：

你的解决方法是什么？
不幸的是我还没有找到解决这个问题的方法。我需要一个我不得不暂时搁置的个人项目。你找到解决办法了吗？
尝试删除multipart/form-data 标头？这对我来说似乎太过分了。我已经从 Angular 完成了简单的发布请求，几乎与没有像您一样手动设置该标头的情况相同，并且它与 multer / FileInterceptor 一起使用。

标签： angular typescript file-upload nestjs

【解决方案1】：

试试你的 create() 函数：

return this.http.patch<any>(
      `${this.domain}/users/avatar/upload/${id}`,
      formData,
      {
        headers: new HttpHeaders()
          .set("Accept", "application/json")    // <=== there is the point      
      }
    );

这对我有用。

【讨论】：