Отправка изображений в угловой клиент в весенний загрузочный отдых API?

Question

Я разрабатываю API для отдыха, используя весеннюю загрузку.У меня есть сервис загрузки изображений, который хранит изображения в рабочей области моего проекта и URL-адрес изображения, хранящийся в БД.У меня есть продукт лица, у которого есть список изображений.Теперь я должен вернуть изображения обратно в угловой клиент.

У меня есть два вопроса:

Q1.Должен ли я вернуть клиенту только список URL изображений?Если да, то как клиент должен отображать изображения с этих URL

Q2.ИЛИ Должен ли я сам возвращать список изображений?Если да, пожалуйста, покажите мне логику, которая быстра и эффективна.

Q3.ИЛИ Должен ли я вернуть отдельное изображение по одному?Если да, пожалуйста, скажите мне, как.

Обновление:

Примечание: Поскольку Rest api находится на одной машине, а Angular клиент - на другой машине.Я думаю, что для URL-адреса изображения нужен какой-то префикс:

Предположим, мой проект находится в E: / myproject /, а изображения в E: /myproject/images/image-name.jpg, так что должен быть префиксдля URL изображения.

Answer 1

Q1.Должен ли я вернуть клиенту только список URL изображений?Если да, то как клиент должен отображать изображения с этих URL-адресов.

Ответ: Возврат списка URL-адресов в угловые.Angular будет использовать этот код.

<div *ngFor="let image of images">
   <img src={{image.ImagePath}} />
</div>

Он будет автоматически извлекать изображения, присутствующие в пути URL

Answer 2

private static final Map<String, MediaType> TYPE_MAP = new HashMap();

    static {
        TYPE_MAP.put("pdf", MediaType.APPLICATION_PDF);
        TYPE_MAP.put("gif", MediaType.IMAGE_GIF);
        TYPE_MAP.put("jpg", MediaType.IMAGE_JPEG);
        TYPE_MAP.put("jpeg", MediaType.IMAGE_JPEG);
        TYPE_MAP.put("png", MediaType.IMAGE_PNG);
        TYPE_MAP.put("html", MediaType.TEXT_HTML);
        TYPE_MAP.put("xls", MediaType.parseMediaType("application/vnd.ms-excel"));
        TYPE_MAP.put("xlsx", MediaType.parseMediaType("application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"));
    }



@GetMapping(value = "/preview")
    public ResponseEntity<Resource> previewFile(@RequestParam String filePath) {
        Resource resource = new UrlResource(Paths.get(filePath).toUri());
        String fileName = testFile.png;
        String extension = png;
        MediaType mediaType = TYPE_MAP.getOrDefault(extension,MediaType.APPLICATION_OCTET_STREAM);
        return ResponseEntity.ok()
                .header(HttpHeaders.CONTENT_DISPOSITION, "filename=\"" + fileName + "\"")
                .contentType(mediaType)
                .body(file);
    }

Отправьте filePath угловому клиенту и используйте этот сервис для предварительного просмотра этого файла.

Answer 3

Q1.Должен ли я вернуть клиенту только список URL изображений?Если да, то как клиент должен отображать изображения с этих URL.

THIS .Поскольку все, что вам нужно сделать дальше, это дать эти URL-адреса <img src="something.png" /> тегам в начале.Это также освободит сервер от ответственности за загрузку изображения и его обслуживание клиентам.

Q2.ИЛИ Должен ли я сам возвращать список изображений?Если да, пожалуйста, покажите мне логику, которая быстра и эффективна.

Это возможно, но очень сложно.Я не советую делать это, так как это заставит систему загрузить образ дважды: сначала из хранилища файлов в бэкэнд, затем 2 из бэкенда в интерфейс.

Q3.ИЛИ Должен ли я вернуть отдельное изображение по одному?Если да, скажите, пожалуйста, как.

Это подход, который вам необходимо использовать, если при загрузке изображений требуется индивидуальная защита.Обеспечить загрузку изображений можно с помощью 1-го подхода, который вы дали, и снова этот подход заставит вас загрузить изображение дважды.