Как отобразить изображение, хранящееся в postgre дБ (как base64) на странице ioni c 4? - PullRequest
Новая
       12

Как отобразить изображение, хранящееся в postgre дБ (как base64) на странице ioni c 4?

1 голос
/ 31 января 2020

Здравствуйте, у меня в таблице весеннее загрузочное приложение. Я храню изображение как byte [] обр. Через запрос get я отправляю свой результат в приложение ioni c на дисплей. Однако в нем не отображается изображение.

Вот код: `

Java Spring Boot (модель) 

 @Column(name = "image")
    public byte []getImage() {
        return image;
    }
    public void setImage(byte [] image) {
        this.image = image;
    }

Java Spring Boot Controller 

 @GetMapping("/drivers/{id}")
    public ResponseEntity<Drivers> getEmployeeById(@PathVariable(value = "id") Long driverId)
            throws Exception {
        Drivers employee = driverRepository.findById(driverId)
                .orElseThrow(() -> new Exception("Employee not found for this id :: " + driverId));
        return ResponseEntity.ok().body(employee);
    }

Angular / Ioni c

etchAlarms(){
    return this.http.get<any>('http://localhost:8080/api/getAllDrivers')
    .subscribe(transformedData =>{
      this.alarmsChanged.next(transformedData);
    });
  }

HTML

 <img src="data:image/png;base64,{{alarms.image}}"/>

Я прочитал почти все вопросы, связанные с этим, но, к сожалению, я не смог решить проблема.

Вот некоторые из связанных вопросов, которые я проверял;

Как отобразить изображение base64 на iPhone в Ioni c 4

Как отобразить изображение в ioni c 4 с использованием angular js

Изображение в кодировке Base64 не отображается в приложениях ioni c framework

Иони c / AngularJS Изображение base64 не будет отображаться

Большое спасибо. Любая помощь приветствуется

РЕДАКТИРОВАТЬ

Вот ошибка из chrome консоли 

unsafe:data:image/png;base64,:1 GET unsafe:data:image/png;base64, net::ERR_UNKNOWN_URL_SCHEME

1 Ответ

1 голос
/ 31 января 2020

.TS 

import { DomSanitizer } from '@angular/platform-browser';

constructor(public _DomSanitizationService: DomSanitizer)

Добавьте это к вашему angular / ioni c

HTML

<img [src]="_DomSanitizationService.bypassSecurityTrustUrl('data:image/jpg;base64,'+alarms.image)"width="50%" height="50%" alt="Image"/>

Добавьте эту строку к вашему HTML ,

Это будет работать.

...