SuspiciousFileOperation в /media/C:/fakepath/example.png при отправке из angular - PullRequest
Новая
       5

SuspiciousFileOperation в /media/C:/fakepath/example.png при отправке из angular

1 голос
/ 03 апреля 2020

Я создаю проект Angular + Django, где пользователь может загрузить файл в модель:

Модель: 

def upload_path(instance, filename):
    return '/'.join(['files', str(instance.titulo), filename])

class File(models.Model):
    titulo = models.CharField(max_length=154, null=False, blank=False)
    file = models.FileField(upload_to=upload_path, null=False)

Когда я отправляю сообщение запрос через бессонницу, все в порядке, файл сохраняется на носителе root (media), но когда я отправляю через Angular путь, который он сохраняет, похож на заголовок, и возникают ошибки.

Angular: 


          <div class="row">
            <label style="margin-left: 10px;">Anexos</label>
            <label id="label-input">
              <input [(ngModel)]="ticket.file" type="file" single id="input-file">
            </label>
          </div>

Услуги: 

htttpHeaders = new HttpHeaders().set("Content-Type", "application/json").set('Authorization', this.token);

  public saveNewTicket(ticket): Observable<any> {

    return this.http.post(this.baseUrl + "ticket/", ticket, {
      headers: this.htttpHeaders
    });
  }

1 Ответ

1 голос
/ 06 апреля 2020

Проблема заключалась в том, что я отправлял данные как json, и для отправки файла или изображения необходимо указывать данные в виде multipart / form, например:

HTML: 

             <form>
                <label id="thumbnail">
                  <input type="file" class="file_selector" (change)=(onFileSelected($event)) />
                </label>
                <button class="btn btn-success" (click)="onUpload()" style="float: right;">Salvar Anexo</button>
              </form>

TS: Создан константный файл 

  onFileSelected(e) {
    this.file = e.target.files[0];

  }

  onUpload() {
    this.crudService.updateFile(this.business.id, this.file).subscribe(data => {
      console.log(data);
    }, err => {
      console.error(err);
    });
  }

crudService.ts: Создайте функцию и создайте новые данные формы, а затем просто добавьте данные 

  public updateFile(ticketid, file): Observable<any> {
    const body = new FormData();
    body.append('id', ticketid);
    body.append('files', file, file.name);
    return this.http.put(this.baseUrl + 'ticket/' + ticketid + '/', body, {
      headers: this.htttpHeadersFormData
    });
  }
...