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> 

Когда я загружаю изображение с использованием 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.