Question

我正在尝试编码AngularJS2中的Image to Base 64字符串

$array  = array('burger', 'melon', 'cheese', 'milk');

与从Java

编码相比，我收到了一个不同的字符串

"not accepted answers"

任何想法我们如何匹配Base64编码？我曾尝试过使用base64编码的角度和

   handleFileSelect(evt) {
        var files = evt.target.files;
        var file = files[0];
        if (files && file) {
            var reader = new FileReader();
            reader.onload = this._handleReaderLoaded.bind(this);
            reader.readAsBinaryString(file);
       }
    }
_handleReaderLoaded(readerEvt) {
       var binaryString = readerEvt.target.result;
       this.model.UserProfileImageBase64 = btoa(binaryString);
      console.log(this.model.UserProfileImage);     
      }

但结果没有任何差异。

BtoA和Base64产生相同的结果，如果我在网上验证它我也会得到图像，但我需要它以Java生成的相同格式

Answer 1

我使用java和javascript获得相同的结果。

使用java我做了：

byte[] imageBytes = IOUtils.toByteArray(new URL("https://www.w3schools.com/css/paris.jpg"));
String base64 = Base64.getEncoder().encodeToString(imageBytes);
System.out.println(base64);

使用javascript我做了：

const fileReader: FileReader = new FileReader();
 fileReader.readAsDataURL(file);
 fileReader.onloadend = () => {
      retVal.next(fileReader.result);
 };

注意：我建议不要使用readBynaryAsString，因为它已被弃用，可能无效。 FileReader

注意：在javascript中，我等到文件上传后才能获取数据，然后传递给可观察的 next（...）

Answer 2

changeListener($event) : void {
  this.readThis($event.target);
}

readThis(inputValue: any): void {
  var file:File = inputValue.files[0];
  var myReader:FileReader = new FileReader();

  myReader.onloadend = (e) => {
    this.image = myReader.result;
  }
  myReader.readAsDataURL(file);
}

<强> component.html

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

请点击此链接Angular 2 encode image to base64

Base64编码的差异

2 个答案: