Photo by Joanna Kosinska on Unsplash
Hi everyone,
In this blog post, I would like to demonstrate you how to run this application developed by me for image server. Storing and serving images is important issue if you develop a product. You need to store images in a file server or db server etc. The good issue of this project is to change width and height your image size with http request. The usage of this app is easy. I will explain the details of the application below.
Table of Contents.
Getting Started
In this blogpost, I have build an application for image serving over http. I used PostgreSQL for storing images. I actually used Spring Boot for backend API. You can easily preview, upload the photos via http, besides, you can adjust the width and height of the photos with REST requests. I will give more information about endpoints of the application below.
Project Structure & Modelling
The project structure of the project like below.
Store Image in PostgreSQL
I have created a Java entity class like below. I used @Lob annotation to store images as byte array. LOB is suitable to store large objects to PostgreSQL. You can examine the source code for other methods in the Image class.
@Entity
@Table(name = "tbl_image", schema = "public")
public class Image extends BaseEntity {
@Lob
@Column(name = "data")
@Type(type = "org.hibernate.type.BinaryType")
private byte[] data;
}
Request has MultipartFile type and I get bytes like file.getBytes(). I also generate a unique name for image when saving time.
public static Image buildImage(MultipartFile file, FileNameHelper helper) {
String fileName = helper.generateDisplayName(file.getOriginalFilename());
Image image = Image.build();
image.setFileName(fileName);
image.setFiles(file);
try {
image.setData(file.getBytes());
} catch (IOException e) {
e.printStackTrace();
}
return image;
}
Endpoints with Swagger
You can easily list, add and scale images with http requests. Detailed information about requests are like below. If you would like to get information about image you need to use /api/images/. This request give you all information about images. On the other hand, If you use other GET requests, you will get the byte[] array about related image. You can use in any html tags or any related platforms.
General Endpoints
GET /api/images list all image informations
Upload Image Endpoints
POST /api/upload upload single image
POST /api/uploads upload multi image
Preview Endpoints
GET /api/show/FILE_NAME
GET /api/show?name=FILE_NAME
GET /api/show?uuid=FILE_UUID
GET /api/show/150/200?uuid=FILE_UUID
GET /api/show/300/200?name=FILE_NAME
GET /api/show/200/400/FILE_NAME
Get all image info request
curl -X GET http://localhost:8080/api/images | json_pp
Get all image info response
[
{
"fileName" : "105747_11112020_69052.jpg",
"fileType" : "image/jpeg",
"size" : 6344,
"uuid" : "caf2a1ad-8dfd-4ec5-8b32-a73c6458a382"
},
{
"fileName" : "140209_11112020_60346.jpg",
"fileType" : "image/jpeg",
"size" : 6344,
"uuid" : "88a2570c-5e38-480d-9cd7-1172cc03f10b"
},
{
"fileName" : "140227_11112020_51882.jpg",
"fileType" : "image/jpeg",
"size" : 6344,
"uuid" : "7a5ced06-bd10-4eae-ae01-bba8a64c10fe"
}
]
Upload single image request.
curl -X POST -H "Content-Type: multipart/form-data" -F "file=@image1.jpg" http://localhost:8080/api/upload | json_pp
Upload single image response.
{
"fileName" : "164428_11112020_88984.jpg",
"fileType" : "image/jpeg",
"size" : 6344,
"uuid" : "b4ebe83b-5013-43ff-a379-87a053bd718e"
}
Upload multiple image request.
curl -X POST -H "Content-Type: multipart/form-data" -F "files=@image1.jpg" -F "files=@image2.jpg" -F "files=@image3.jpg" http://localhost:8080/api/uploads | json_pp
Upload multiple image response.
[
{
"fileName" : "164547_11112020_52367.jpg",
"fileType" : "image/jpeg",
"size" : 6344,
"uuid" : "76831015-1426-44d1-b34e-1044e9f3c83f"
},
{
"fileName" : "164547_11112020_67882.jpg",
"fileType" : "image/jpeg",
"size" : 4889,
"uuid" : "9b4c89cf-3cbf-4b79-bf0e-e488365c56a2"
},
{
"fileName" : "164547_11112020_62247.jpg",
"fileType" : "image/jpeg",
"size" : 22152,
"uuid" : "e646b5e7-b859-43d3-ad30-abf0118fbfb5"
}
]
Docker & Docker Compose
I used Docker & Docker compose for running the application.
DockerFile detail.
FROM openjdk:11
ADD ./target/imageserver-0.0.1-SNAPSHOT.jar /usr/src/imageserver-0.0.1-SNAPSHOT.jar
WORKDIR usr/src
ENTRYPOINT ["java","-jar", "imageserver-0.0.1-SNAPSHOT.jar"]
Docker Compose file detail.
version: '3'
services:
db:
image: "postgres"
ports:
- "5432:5432"
environment:
POSTGRES_DB: postgres
POSTGRES_USER: postgres
POSTGRES_PASSWORD: ekoloji
app:
build: .
ports:
- "8080:8080"
environment:
SPRING_DATASOURCE_URL: jdbc:postgresql://db/postgres
SPRING_DATASOURCE_USERNAME: postgres
SPRING_DATASOURCE_PASSWORD: ekoloji
depends_on:
- db
Build & Run Application
Build docker-compose command.
docker-compose build
Run docker-compose
docker-compose up
Stop docker-compose
docker-compose down
Demo
I hope you enjoy while reading.
Have a nice coding.
Source code available in github. coderkan - Overview Arctic Code Vault Contributor my medium personal blog archive --> 1 This Library can be used to communicate with the…github.com