无法使用 Angular/Spring 上传文件

Question

标题说明了一切。

我需要上传 files/documents 到 BE，不知怎么的我就是搞不定！

Angular 服务

public saveFile(file: File): Observable<any> {
        const formData = new FormData();
        formData.append('file', file);
        
        return this.http
            .post<FormData>(`${environment.apiUrl}/save-file`, formData)
            .pipe(first());
    }

Spring 控制器

 @PostMapping(value = "/save-file")
    public ResponseEntity<Object> saveFile(@RequestParam("file") MultipartFile file) {

        System.out.println(file);

        return null;
    }

我已经尝试了很多其他配置，比如将 headers 设置为

"Content-Type": "multipart/form-data"

错误信息总是一样的：

Current request is not a multipart request

Answer 1

如果您的请求 body 是 instanceof FormData angular 为您添加 header 。你不需要添加 header .

我想你有拦截器配置来添加一些 header 到你所有的 http 请求。尝试将此条件添加到您的拦截器 class :

        if (!request.headers.has("Content-Type") && !(request.body instanceof FormData)) {
            request = request.clone({
               headers: request.headers.set("Content-Type", "application/json")
            });
        }

无法使用 Angular/Spring 上传文件

Unable to upload file using Angular/Spring

angular

spring

multipartform-data

angular-httpclient