如何修复从angular 7到django rest的上传文件

我用djago开发了rest api，用agular7开发了应用程序前端，当我尝试用表单数据发送图像时，我尝试将图像上传到我的rest api。表单数据在api中是空的

对于angular，我尝试使用文件发送表单数据

Angular:
   getPredictionImage(file): Observable<any> {
      const HttpUploadOptions = {
        headers: new HttpHeaders({ 'Content-Type': 'multipart/form-data'})
      }
      const f = new FormData();
      f.append('image', file, file.name);
      console.log(f);
      return this.http.post(this.urlapiimage, file, HttpUploadOptions);
    }

---

request.data为空

它对我有效，这可能有助于你找到解决方案

Angular :
upload(file): Observable<any> {
  let csrftoken  = getCookie('csrftoken');
  let headers = new HttpHeaders({

    'Access-Control-Allow-Origin': '*',
    'X-CSRFToken': csrftoken,

  });
  const formdata = new FormData();
   formdata.append("image", file); //i did not use 3rd argument file.name
  let options = {
    headers: headers,  withCredentials :true  } 
  return this.http.post(this.urlapiimage , formdata,  options )

}

Django:
    def post(self, request, format=None):
       if 'file' not in request.data:
            raise ParseError("Empty content ")

        photo = request.data["file"]
        serializer = MammographySerializer(photo = photo) // use this instead data =request.data
        if serializer.is_valid():
            result='hi'
            serializer.save()
            return Response(result,status=status.HTTP_201_CREATED)
        return Response(serializer.errors, status=status.HTTP_400_BAD_REQUEST)

角度：
上传（文件）：可观察）

“如果您使用chrome，并且如果您使用django服务器和本地主机，那么这一点很重要：4200/对于angular，因为CORS（不同的端口）chrome不允许。使用127.0.0.1:4200/作为angular server而不是localhost:4200/如果您不想这样做，请使用firefox而不是chrome，它允许CORS
这对我很有效，可能有助于您找到解决方案

Angular :
upload(file): Observable<any> {
  let csrftoken  = getCookie('csrftoken');
  let headers = new HttpHeaders({

    'Access-Control-Allow-Origin': '*',
    'X-CSRFToken': csrftoken,

  });
  const formdata = new FormData();
   formdata.append("image", file); //i did not use 3rd argument file.name
  let options = {
    headers: headers,  withCredentials :true  } 
  return this.http.post(this.urlapiimage , formdata,  options )

}

Django:
    def post(self, request, format=None):
       if 'file' not in request.data:
            raise ParseError("Empty content ")

        photo = request.data["file"]
        serializer = MammographySerializer(photo = photo) // use this instead data =request.data
        if serializer.is_valid():
            result='hi'
            serializer.save()
            return Response(result,status=status.HTTP_201_CREATED)
        return Response(serializer.errors, status=status.HTTP_400_BAD_REQUEST)


角度：
上传（文件）：可观察）

“如果您使用chrome，如果您使用django server和localhost:4200/对于angular，这一点很重要，因为chrome不允许使用CORS（不同端口）。使用127.0.0.1:4200/作为angular server而不是localhost:4200/如果您不想使用firefox而不是chrome，它允许CORS
console.log打印正确的图像吗？如果我打印文件：{name:“general diagramme（11.png）”，lastModified:156192837115……}，但是如果我打印formData:formData{}为什么不使用不同的客户端（如postman或good old curl）检查后端？如果您的后端正在工作，那么。。。问题出在交通上。否则，问题是您的后端。console.log是否打印正确的图像？如果我打印文件：file{name:“general diagramme（11）.png”，lastModified:156192837115……}，但是如果我打印formData:formData{}，为什么不使用其他客户端（如postman或good old curl）检查您的后端？如果您的后端正在工作，那么。。。问题出在交通上。否则，问题在于您的后端。