使用javascript上传到服务器之前调整图像大小

Question

我有一些关于这个问题的研究，但是我找不到我需要的东西。

在Html方面，下面是代码。顺便说一下，代码是以角度编写的。

<input type="file" (change)="onChange($event)" accept=".jpg,.gif,.png" multiple="multiple"> 

在onChange方法中，我将请求发送到makeFileRequest方法。

onChange(event: any) {
    var files = event.srcElement.files;
    this.apiModel.makeFileRequest(`${API_URL"/PostImage"}`, [], files).subscribe((res: any) => {
        console.log("all files uploaded");
    });
}

makeFileRequest方法正在将文件发送到服务器。此代码工作正常。

public makeFileRequest(url: string, params: string[], files: File[]): Observable<Response> {
          return Observable.create((observer:any) => {
               let formData: FormData = new FormData(),
                  xhr: XMLHttpRequest = new XMLHttpRequest();


              for (let i = 0; i < files.length; i++) {
                formData.append("uploads[]", files[i], files[i].name);
               }

              xhr.onreadystatechange = () => {
                  if (xhr.readyState === 4) {
                      if (xhr.status === 200) {
                          observer.next(JSON.parse(xhr.response));
                          observer.complete();
                      } else {
                        if (xhr.status == 401) {
                          this.authService.logout();
                          this.router.navigate(['login']);
                         } 
                          observer.error(xhr.response);
                      }
                  }
              };

              xhr.open('POST', url, true);
              xhr.send(formData);
          });
      }

但我认为我必须在下面的代码中做我需要的东西来调整图像大小。

for (let i = 0; i < files.length; i++) {
    formData.append("uploads[]", files[i], files[i].name);
}

你能告诉我一个解决问题的方法吗？