Hello guys! Welcome to a new video where
i'm building the backend part of a website.
Where i'm building the backend part of a social network with
spring boot. Today, i will show you how to accept the images from the frontend.
How images are uploaded to the backend and how to store them.
If you're ready, click on subscribe and let's go! So, i have to prepare the backend to
accept images, then i have to store those images linked
to a user, and allow the request to return the
stored images. i'm gonna start by the controller to
upload an image to the backend. For that, i need the Multipart file. This
object contains the binary content of the image and some
metadata, as the name of the file, extension,
the size and some other information. Ok, i need to create this entry in the
community service to store the image. But where will i store the image? An
option is to store the image in the database.
But that's not a good idea. The images tend to be big.
And the database is more performant when using small data.
What i will, is store the data in the hard drive. In fact, a better option is to store
them in an NFS or upload them to a CDN. Why store them in an NFS, a Network
File System, or to a CDN, a Content Delivery Network?
This way, the images are stored in a separated machine
than the one which is running the application. And separated from the
database too. If a problem occurs in some machine, as
the content is separated in multiple machines,
you have less probability to lose the data. i will assume
i have the NFS mounted in my machine at some path. i've created this value in the
configuration file. And then, in the service,
this annotation will inject me the value to this variable.
And now, store the incoming image at this path. Let's first
create the domain object. Now, make the connection for the user for
the many-to-one relationship. And add the liquibase scripts. I will need to store the path where i've
stored the image. And link this image to the user who
uploaded it. i will store the path of the image only.
This way, i leave the database with lightweight data,
just a pointer to the image. And when retrieving it,
as the image is in a shared resource, a public shared resource,
i return the URL, which points to the image itself. Ok, until now, i only store the images
which i receive from the controller. How to return them when asked? As i said,
i only return a URL. Why? The images
are static resources, they won't change upon a user request.
And they are big resources, heavy weight resources.
I may use a CDN to return them. What's a CDN?
With a CDN i have the images duplicated in several servers all around the world
to let the user download them from the nearest server. Otherwise, if i
have to download the images always through the backend, i add an additional
load to the backend. This will increase the response time of the backend. And as
they are heavyweight, this will consume a lot of CPU
and memory from the backend server. If the images are stored in a separate
server, in multiple separated servers, in multiple
CDNs, i won't need any resource from the
backend server, and the images will be near to the user which makes the request.
if they are nearest, they will be downloaded faster. So,
to return them, i will start with the controller. And now, in the service return the
information with the path of the image. The complete URL will be
built at the frontend part to let the frontend
download the image. The main point of this architecture is
to separate the content from the running application.
If something wrong happens to the server where the application is running,
i won't lose all the images, as for the database,
it should be in a separated server. And then, to return the images,
i will only use a network server, a CDN, to optimize the download time of the
images. A CDN is a service that must be
purchased with the provider of your internet resources.
Understood? Any question? Leave a message with your questions,
i will try to answer. Click on the like button and subscribe for more videos.
See you soon!
