如何在 Flutter+Spring Boot+PostgreSQL+Heroku 结构中发送和存储图像？

Question

I am developing a mobile application with Flutter framework.

In backend API side, I use Spring Boot framework and deploy it to the Heroku (free-plan).

In database side, I use PostgreSQL add-on in Heroku .

Everything okay before working with the images. I am confused when I need to send image to server and store it. What is best practice of it? I saw two option after the some searching. These are:

First Option

1. In Flutter side, take the image from the user
2. In Flutter side, convert the image to the BASE64 string format.
3. In Flutter side, POST it as a JSON object to backend.
4. In Spring Boot side, get the BASE64 string and store it to the PostgreSQL db.

Second Option

1. In Flutter side, take the image from the user
2. In Flutter side, convert the image to the BASE64 string format.
3. In Flutter side, POST it as a JSON object to backend.
4. In Spring Boot side, get the BASE64 string and convert it to the real image file;
5. In Spring Boot side, save the actual image file into the file system of hosting machine and store path of the image to the PostgreSQL db. (But Heroku doesn't allow writes on its filesystem) (Even it is possible to write on its filesystem, Every new deployment, the images would be gone)

if I choose second option, what should I do for solving the saving image in file system of Heroku ?

Which option should I use?

Are there any another good option?

Answer 1

Saving images in your database is usually not recommended. Instead you could try hosting on another platform (for example AWS) that does allow file storage.

However, if you do not have too many images and won't access them very often, you can store them in the database. Instead of the first option however, I recommend letting Spring boot convert your BASE64 string to an actual image. You can then store this image as a BLOB in your database. This makes sure the database optimizes for BLOBs and doesn't create indexes and other optimizations for text entries.

Answer 2

i think you should:

1. take the image from the user in the flutter app;
2. convert the image in the base64 format;
3. send to the backend by rest api in json format;
4. in the spring app convert the string into a blob data and save in the database;

when you need to read that:

1. retrieve the blob from the db;
2. convert to the string;
3. send to flutter;
4. convert to real image;

i usually face up this requirement with this approach and it works really well. i write bellow a simple function from/to blob/string that you can use

toBlob

public static Blob toBlob(String s) throws SQLException {
   if (Objects.nonNull(s)) {
      return new SerialBlob(s.getBytes(StandardCharsets.UTF_8));
   } else return null;
}

toString

public static String toString(Blob b) throws SQLException {
   if (Objects.nonNull(b)) {
     return new String(b.getBytes(1L, (int) b.length()), StandardCharsets.UTF_8);
   } else return null;
}