powered by simpleCommunicator - 2.0.30     © 2024 Programmizd 02
Map
Форумы / Java [игнор отключен] [закрыт для гостей] / Не могу отобразить картику на странице html
19 сообщений из 19, страница 1 из 1
Не могу отобразить картику на странице html
    #40066569
chron
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Здравствуйте.
Не могу отобразить на странице html картинку, полученную из бд.
База Данных postgres 13, способ доступа spring-data-jdbc, среда выполнения idea community.
Картинка jpg корректно хранится в бд и читается в массив byte[]. Я могу её посмотреть на клиенте с пом. контроллера spring как
Код: java
1.
2.
InputStream is = new ByteArrayInputStream(qlist.get(0).getDataImage());
IOUtils.copy(is, response.getOutputStream()); 


где getDataImage() - это тип byte[]
Но не могу отобразить её в тэгах html, напр., как
Код: html
1.
2.
3.
<td>
<img src="${el.dataImage}" width="124" height="124" alt=""/>
</td>


где el.dataImage - это то же самое поле класса с типом byte[]

Размер картинок ок. 200kb
пробовал неск. способов, но не смог увидеть картинку. Подскажите, кто знает.
...
Рейтинг: 0 / 0
Не могу отобразить картику на странице html
    #40066574
PetroNotC Sharp
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
chron,
F12 нажми
...
Рейтинг: 0 / 0
Не могу отобразить картику на странице html
    #40066577
chron
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
PetroNotC Sharp,
подсказка строки
Код: html
1.
src="${el.dataImage}" 


говорит: не удалось загрузить изображение.
...
Рейтинг: 0 / 0
Не могу отобразить картику на странице html
    #40066582
PetroNotC Sharp
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
chron,
Скрин дай. Второе - рядом поставь показ статическогого изображения. Тестового в папке аппсервера
...
Рейтинг: 0 / 0
Не могу отобразить картику на странице html
    #40066593
chron
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
скрин даю.

по поводу "Второе - рядом поставь показ статическогого изображения. Тестового в папке аппсервера" не вполне понятно.
можно подробнее.
...
Рейтинг: 0 / 0
Не могу отобразить картику на странице html
    #40066597
PetroNotC Sharp
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
chron,

По шагам
- создать в корне проекта папку images
- кинуть туда png, jpg
- набрать
http....../my.jpg
Должен увидеть в браузере
...
Рейтинг: 0 / 0
Не могу отобразить картику на странице html
    #40066599
PetroNotC Sharp
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
chron,
>где el.dataImage - это то же самое поле класса с типом byte[]
= мне кажется нужен тип строка как урл. Где ты и отдаешь байты.
У вади спроси
...
Рейтинг: 0 / 0
Не могу отобразить картику на странице html
    #40066602
chron
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
PetroNotC Sharp,
файлы с диска я вижу, не могу передать данные byte[] на другую страницу.
идея-то неплохая: взять данные с бд и сразу отправить их по адресу. такой канал передачи. pipeImage.
...
Рейтинг: 0 / 0
Не могу отобразить картику на странице html
    #40066606
chron , ты хочешь бинарные данные встроить в текстовый HTML? Во-первых, судя по потому что EL выражение не заменилось ни на что - возможно эти классы/поля отсутствуют в контексте. Может конечно твой инструмент понимает что бинарный byte[] нельзя встроить в HTML, но че-т сомневаюсь.. И мы плавно переходит ко второй части: обычно src указывать на URL, но если требуется встроить картинку прям в саму разметку, то нужно конвертировать ее в Base64 и добавить content type и пр. перед самими данными.
...
Рейтинг: 0 / 0
Не могу отобразить картику на странице html
    #40066613
Kachalov
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
chron
файлы с диска я вижу, не могу передать данные byte[] на другую страницу.
идея-то неплохая: взять данные с бд и сразу отправить их по адресу. такой канал передачи. pipeImage.

Либо делайте сервлет, который по URL отдает нужную картинку, что то типа:
Код: html
1.
<img src="/servlet/getImage?123">


либо, если очень хочется именно байты сразу в HTML вкрячить (что увеличивает вес страницы и лишает возможности использовать кэширование изображения в браузере), то:
Код: html
1.
<img src="data:image/png;base64,здесь_BASE64_данные">
...
Рейтинг: 0 / 0
Не могу отобразить картику на странице html
    #40066614
PetroNotC Sharp
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
chron
PetroNotC Sharp,
файлы с диска я вижу, не могу передать данные byte[] на другую страницу.
идея-то неплохая: взять данные с бд и сразу отправить их по адресу. такой канал передачи. pipeImage.
не передавай. Урл передай. Кеш будет работать
...
Рейтинг: 0 / 0
Не могу отобразить картику на странице html
    #40066615
chron
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Stanislav Bashkyrtsev, спасибо.
1. конечно, встроить бинарные данные в текст напрямую не получится. но строка
Код: java
1.
IOUtils.copy(is, response.getOutputStream()); 


срабатывает: печатает картинку.

2. конвертирование в Base64 применялось. Вот закомментированные остатки кода
Код: java
1.
2.
//String imageBase64 = Base64.getEncoder().encodeToString(qlist.get(0).getDataImage());
//qlist.get(0).setImageBase64(imageBase64);

в это случае вместо строки
Код: html
1.
<img src="${el.dataImage}" width="124" height="124" alt=""/>


использовалось
Код: html
1.
<img src="${el.imageBase64}" width="124" height="124" alt=""/>


с тем же результатом.

3. я почему-то ощущаю, что решение - форматирование byte[] и передача нового формата на страницу.
...
Рейтинг: 0 / 0
Не могу отобразить картику на странице html
    #40066616
chron
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
PetroNotC Sharp
chron
PetroNotC Sharp,
файлы с диска я вижу, не могу передать данные byte[] на другую страницу.
идея-то неплохая: взять данные с бд и сразу отправить их по адресу. такой канал передачи. pipeImage.
не передавай. Урл передай. Кеш будет работать


не понял: а какой url установить в данном случае для значения поля:
Код: html
1.
src="${el.dataImage}" 
...
Рейтинг: 0 / 0
Не могу отобразить картику на странице html
    #40066617
PetroNotC Sharp
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
chron
PetroNotC Sharp
пропущено...
не передавай. Урл передай. Кеш будет работать


не понял: а какой url установить в данном случае для значения поля:
Код: html
1.
src="${el.dataImage}" 

выше сказали. Строка урл на сервлет или маппинг спринга рест
...
Рейтинг: 0 / 0
Не могу отобразить картику на странице html
    #40066619
PetroNotC Sharp
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
chron,
РЕСТ спринга должен отдать картинку просто по урл!
...
Рейтинг: 0 / 0
Не могу отобразить картику на странице html
    #40066620
chron
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Kachalov,
понятно.
Но такое решение, наверное, лучше оставить на крайний случай.
...
Рейтинг: 0 / 0
Не могу отобразить картику на странице html
    #40066621
PetroNotC Sharp
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
chron
Kachalov,
понятно.
Но такое решение, наверное, лучше оставить на крайний случай.
какое?
Веб заточен на документы из урл. А не base64
...
Рейтинг: 0 / 0
Не могу отобразить картику на странице html
    #40066624
chron
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
PetroNotC Sharp,
да, @RestController я здесь не использовал. буду попробовать.
...
Рейтинг: 0 / 0
Не могу отобразить картику на странице html
    #40067005
chron
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
решение найдено. надеюсь, кому нибудь это тоже пригодится:
1. в html нужно установить ссылку на путь контроллера
Код: html
1.
<img th:src="@{/images/{id}(id=${el.idImage})}"/>



2. этот путь с get запросом таков:
Код: java
1.
@GetMapping("/images/{id}")



3. а сам контроллер предельно прост:
Код: java
1.
2.
3.
4.
5.
6.
7.
    public void showImage(@PathVariable String id, HttpServletResponse response) throws IOException {
        response.setContentType("image/jpeg");
        List<Image> qlist = qservice.imagelist(1, 12);  // (1, 12) - это мои отладочные данные

        InputStream is = new ByteArrayInputStream(qlist.get(Integer.parseInt(id)).getDataImage());
        IOUtils.copy(is, response.getOutputStream());
    }
...
Рейтинг: 0 / 0
19 сообщений из 19, страница 1 из 1
Форумы / Java [игнор отключен] [закрыт для гостей] / Не могу отобразить картику на странице html
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Найденые пользователи ...
Разблокировать пользователей ...
Читали форум (0):
Пользователи онлайн (0):
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]