В качестве пет проектов и в обучающих видео по Java чаще всего пишут, либо консольные приложения, либо REST API сервисы (что вполне логично, ведь на Java в основном пишут бэкенд), но что делать, если вы написали самое лучше в мире приложение, в котором используются картинки, например: аватарка, логотип или просто для красоты страницы логирования, как в этом видео?
В конце приведенного в примере видео, для отображения картинки на странице автор использует строку в css файле «background: url('/img/1.jpg') no-repeat;» где /img/1.jpg это путь к картинке в вашем проекте. Собственно, я так и сделал в своем приложении, при запуске превью страницы из Idea все работало и отображалось, но, когда я запускаю приложение (разработанное на Spring Boot) страница отображается пустой!
Долгий поиск нестыковок не давал результатов… браузер ошибок не выдает, приложение работает штатно и ошибок нет, панель разработчика браузера тоже особо ответа не дает показывая, что страница отображается и браузер даже видит ссылку на картинку.
Если вы столкнулись с такой же проблемой, то хочу поделиться решением! Оказалось, что браузер пытаясь отобразить страницу, видит путь к картинке, который прописан в файле css (вот этот - «background: url('/img/1.jpg') no-repeat;») и посылает GET запрос к приложению, который будет выглядеть так «http://localhost:8080/img/1.jpg».
Возможно, вы уже догадались, каков ответ – нужно сделать специальный контроллер в вашем приложении, который будет принимать этот запрос и передать картинку в браузер. А написать контроллер для джависта это уже раз плюнуть, вот пример контроллера, который будет принимать запрос и отдавать в браузер картинку из вашего приложения:
```
@GetMapping("/img/{imageName}")
@ResponseBody
public ResponseEntity<byte[]> getImage(@PathVariable String imageName) throws IOException {
ClassPathResource imgFile = new ClassPathResource("static/img/" + imageName);
byte[] bytes = StreamUtils.copyToByteArray(imgFile.getInputStream());
HttpHeaders headers = new HttpHeaders();
headers.setContentType(MediaType.IMAGE_JPEG);
headers.setContentLength(imgFile.contentLength());
return new ResponseEntity<>(bytes, headers, HttpStatus.OK);
}
```
Надеюсь, данное решение вам поможет, мне оно далось не сразу. Если вы знаете более элегантное решение прошу написать его в комментариях 😊
