Java Spring skicka mapp med filer till frontend ?

Permalänk

Java Spring skicka mapp med filer till frontend ?

Jag vill skapa ett enkelt bildgalleri i en React-frontend med hjälp av bilder som lagras i en Java-spring backend. Jag kan visa en enstaka bild med följande kod:

Backend:

@CrossOrigin(origins = "http://localhost:3000") @GetMapping(value = "gallery/test",produces = MediaType.IMAGE_JPEG_VALUE) public @ResponseBody byte[] getImage() throws IOException { return IOUtils.toByteArray(getClass() .getResourceAsStream("/gallery/test/images.jpg")); }

Frontend:

const [image, setImage] = useState(""); const onClickHandler = async () => { const result = await fetch("http://localhost:8080/gallery/test"); const blob = await result.blob(); const url = URL.createObjectURL(blob); setImage(url); };

Men hur gör jag för att hämta en hel mapp med bilder från backenden? Jag vill ha ett gäng endpoints i spring som är knutna till olika mappar. Och beroende på vilken endpoint jag anroipar så hämtas alla bilderna till frontenden och skapar ett galleri av dessa.

Permalänk
Medlem

Rent spontant hade jag nog gjort en lista med strängar av paths till varje bild istället. Vet inte om det är best practice, men känns rimligt om man vill ha en skalbar design där bilderna hostas på en filserver (då är det väldigt onödigt att BE hämtar bilderna och sen skickar till frontend). Förutsatt att frontenden har access till den path där bilderna finns. Skulle gissa att faktiskt skicka byte-information för bilder används mest vid uppladdning av bilder från FE till BE.