Angular2 net::ERR_UNKNOWN_URL_SCHEME для изображения Base64

Question

Я пытаюсь отобразить изображения jpg/png на HTML. С сервера я получаю строку Base64. Который я отображаю в HTML как:

<md-card>
  <md-card-content>
    <img id="uploadPicture" class="uploadPicture" [src]="'data:image/jpg;base64,' +file_src ">
  </md-card-content>
  <md-card-actions>
    <input id="uploadedFile" type="file" #fileInput (change)="chooseImage(fileInput.files)"/>
    <button md-raised-button color="primary" [disabled]="isUploaded" (click)="uploadPicture(fileInput.files)">{{'upload picture' | translate}}</button>
    <button md-raised-button color="primary" [disabled]="isRemoved" (click)="removePicture()">{{'remove picture' | translate}}</button>
  </md-card-actions>
</md-card>

Когда я загружаю картинку, используя PUT URL, она работает нормально. Но когда я пытаюсь скачать его с помощью GET API, он выдает ошибку как:

нетто::ERR_UNKNOWN_URL_SCHEME

Я получаю предупреждение также как:

ВНИМАНИЕ: очистка небезопасного значения URL

Я использую дезинфицирующее средство в моем компоненте, как показано ниже:

ngOnInit(): void {
    if(this.file_src!='')
    {
      this.userService.getPicture()
      .then(
      (response:any) => {
        console.log(response);
        this.file_src = response.json();
        this.file_src = this._sanitizer.sanitize(SecurityContext.URL, `data:image/png;base64,${this.file_src}`);
      }
      )
      .catch(
      (error:any) => {
        this.displayError();
      }
      )
    }
  }

Но это не сработало. Может кто-нибудь сказать мне, что может быть проблемой?

Answer 1

При загрузке изображения добавьте http:\ или https:\ в base64string.