Файл не загружается на сервер ionic3 - PullRequest
Новая
       33

Файл не загружается на сервер ionic3

0 голосов
/ 25 сентября 2018

У меня есть сценарий, в котором я загружаю файл изображения с локального диска (введите jpeg или png) в конечную точку API с использованием ionic.Вот мой код ниже:

fileupload.html -> 

//---------------------------------------------------
  <ion-item>
    <ion-input type="file" accept="image/*" (change)="changeListener($event)"> </ion-input>
  </ion-item>

fileupload.ts -> 

changeListener($event):void{
    this.file=$event.target.files[0];
    console.log(this.file);
    console.log("upload...");
    let regData={"file":this.file};
    console.log("REGDATAA"+JSON.stringify(regData));
    this.jira.postAttachment("PM-3",regData).subscribe(dataa=>{
      console.log(dataa);
    });
  }

provider.ts -> 

public postAttachment(key,data):Observable<any>{
    console.log(JSON.stringify(data))
    return this.http.post(this.api+'/issue/'+key+'/attachments',JSON.stringify(data),{
      headers: new HttpHeaders()
        .append('Authorization', `Basic ${this.auth.getAuthString()}`)
        .append('Content-Type','multipart/form-data';boundary="-------xe3rtyhrfds")
        .append("X-Atlassian-Token", "no-check")
        .append("User-Agent", "xx")
    });
  }

каждый раз, когда я отправляю файл, он не получает путь и отправляет пустой ответ, вот ошибка ниже. 

 //----------------------------------------------------
  [object File]: {lastModifiedDate: [date] Fri Sep 21 2018 17:42:46 GMT+0530 (India Standard Time), name: "download.jpg", size: 5056, type: "image/jpeg", webkitRelativePath: ""}

 upload...
ion-dev.js (157,11)

 REGDATAA{"file":{}}
ion-dev.js (157,11)

 {"file":{}}
ion-dev.js (157,11)

ERROR [object Object]

Я решил проблему с CORS, и нетпроблема с тем же.

Когда я отправляю тот же ответ, используя почтальон, он успешно завершает вот что я отправляю в Почтальон. 

Form-data 
key - "file" (type file) value - "/path/to/my/file"

Headers
Content-type - application/json
x-attlassian token - no-check

Может кто-нибудь посоветовать, что здесь происходит не так.

Ответы [ 4 ]

0 голосов
/ 04 октября 2018

При возникновении проблемы с AngularJS (в конечном итоге вам может помочь подобный подход):

  • создайте скрытый файл ввода типа de *

  • установить его значение в функции changeListener

  • сделать файл отправлять оттуда впоследствии

    • Причина в том, что некоторые встроенные свойства ввода файладавайте признаем его значение как File / Blob вместо пути, который используют многие «сложные» компоненты.

  • Также отправьте его как составной файл, как упоминалось ранее.

0 голосов
/ 25 сентября 2018

Лучший способ - закодировать ваше изображение в base64 и отправить его.Все зависит от того, что нужно вашему серверу.

или вы можете попробовать это.

const body = file;

    const headers = new Headers({'Content-Type': 'image/jpg'});
    return this.http.post(this.api+'/issue/'+key+'/attachments, body, {headers: headers}). ...
0 голосов
/ 28 сентября 2018

Используйте FormData для загрузки файла.

fileupload.ts 

    changeListener(event) {

      const fd = new FormData();
      this.file = event.target.files[0];
      fd.append('file', this.file, this.file.name);
      this.jira.postAttachment("PM-3",fd)
        .subscribe(data => {

          console.log(data);
    });
  }

provider.ts 

  postAttachment(key, fd): Observable<any> {

  const httpOptions = {
    headers: new HttpHeaders(
      { 'Content-Type': 'multipart/form-data' },
      { 'Authorization': `Basic ${this.auth.getAuthString()}` })
      };
  return this.http.post(this.api+'/issue/'+key+'/attachments', fd, httpOptions);

  }
0 голосов
/ 25 сентября 2018

Вам необходимо изменить тип контента с application/json на multipart/form-data.Вы отправляете изображение, а не json-файл.

...