使用ionic 4中的FormData将捕获的视频上传到服务器

时间:2020-07-09 11:07:11

标签: javascript typescript cordova html5-video ionic4

我已经从Android设备成功捕获了录像,但是无法使用formData将其上传到服务器,并且无法以html显示视频。下面是我的代码:

video.ts

captureVideo() {
let options: CaptureVideoOptions = {
  limit: 1,
  // duration: 30,
};
this.mediaCapture.captureVideo(options).then(
  (res: MediaFile[]) => {
    let capturedFile = res[0];
    this.readVideoFile(capturedFile);
  },
  (err: CaptureError) => console.error(err)
);
}

readVideoFile(file: any) {
//console.log('inside readVideo', file);

var movVideo = {
  uri: file['localURL'].split('/'),
  type: 'video/mp4',
  name: file.name,
  size: file.size,
};
var imageBlob = new Blob([file], movVideo);
const formData = new FormData();
formData.append('file', imageBlob, file.name);
//console.log('FORM DATA 515 ---->', formData.getAll('data'));
this.upload.captureFileUpload(formData).subscribe(
  (res) => {
    // Store the token value in local storage for future use.
    //console.log('------------captureImageFileUpload resp--------', res);
  },
  (err) => {
    //console.log('------------captureImageFileUpload err--------', err);
  }
);
}

video.html

<ion-icon
    name="videocam"
    class="send"
    slot="end"
    (click)="captureVideo()"
    *ngIf="!isDesktop"
  ></ion-icon>


  <video controls class="chat-video">
   <source src="{{attachment_file_path}}?name={{attachValue.fileName}}" type="{{attachValue.mimeType}}"/>
    Your browser does not support HTML video.
  </video>

任何帮助都很感激

0 个答案:

没有答案