Remarques

Créé comme exemple car il y avait une demande de téléchargement d'une image à l'aide de SpringMVC et de la sortie. Ce n'est qu'un exemple de niveau, donc j'ignore la validation et je ne vérifie pas l'extension. Je peux télécharger des images, mais je ne les ai pas enregistrées. Pour ceux qui veulent le faire pour le moment.

Environnement d'exécution

L'environnement d'exécution est le suivant

Nom	Version etc.
IDE	sts-4.0.1.RELEASE
Java	Java1.8
SpringFrameworkBoot	2.1.9
SpringDependencyManagement	1.0.8

Flux de fonctionnement

Les échantillons à créer peuvent être classés comme suit (à l'exclusion de la classe FirstApplication)

① HTML pour télécharger des images ② Formulaire pour stocker des données d'image ③ Contrôleur pour transmettre les données d'image ④ HTML pour afficher l'image téléchargée

Code réel

Html correspondant à ①

`upload.html`


<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="UTF-8" />
    <title>upload.html</title>
</head>

<body>
    <!--Notez que si vous ne définissez pas enctype dans le formulaire, le contenu de l'image ne sera pas envoyé.-->
    <form th:action="@{/upload}" th:object="${imageForm}" method="post" enctype="multipart/form-data">
Sélectionnez les fichiers:<input type="file" th:field="*{image}" /><br /> <input type="submit" value="Envoyer" />
    </form>
</body>

</html>

Le point est ʻenc type =" multipart / form-data " ` Sans cela, le contrôleur ne peut pas recevoir les données de contenu (seul le nom du fichier peut être reçu)

Formulaire correspondant à ②

`imageForm.java`


package com.practice.demo_spring.web;

import org.springframework.web.multipart.MultipartFile;

public class ImageForm {

	private MultipartFile image;

	public MultipartFile getImage() {
		return image;
	}

	public void setImage(MultipartFile image) {
		this.image = image;
	}

}

Une classe de formulaire qui n'arrive jamais.

Contrôleur correspondant à ③

`UploadController.java`


package com.practice.demo_spring.web;

import org.apache.tomcat.util.codec.binary.Base64;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.ModelAttribute;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestMapping;

@Controller
public class UploadController {
	
	@ModelAttribute
	public ImageForm setForm() {
		return new ImageForm();
	}
	
	/**
	 *Premier hôte local:8080/télécharger avec le premier.Configurer pour accéder au HTML
	 * @return　upload.html
	 */
	@RequestMapping("/first")
	public String first() {
		return "upload";
	}
	
	
	/**
	 *Obtenez les données d'image téléchargées et encodez-les avec base64
	 *Changer la version codée en chaîne(Dans le même temps, spécifiez ici l'extension en jpeg.)Et passez-le au html suivant
	 * @param imageForm Données téléchargées
	 * @param model
	 * @return
	 * @throws Exception
	 */
	@PostMapping("/upload")
	public String upload(ImageForm imageForm, Model model) throws Exception {
		System.out.println(imageForm.getImage().getSize());
		StringBuffer data = new StringBuffer();
		String base64 = new String(Base64.encodeBase64(imageForm.getImage().getBytes()),"ASCII");
		data.append("data:image/jpeg;base64,");
		data.append(base64);
		model.addAttribute("base64image",data.toString());
		return "express";
	}

}

En tant que processus, (1) Obtenez les données d'image stockées dans imageForm et faites-en un tableau d'octets ② Encodez-le en base64 et changez-le en type String ③ Combinez la chaîne précédemment modifiée avec "data: image / jpeg; base64" pour en faire une forme qui peut être spécifiée avec <img ht: src = "">. Suivre le flux ci-dessus

Html correspondant à ④

`express.html`


<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
  <head>
    <meta charset="UTF-8" />
    <title>express.html</title>
  </head>
  <body>
L'image est<img th:src="${base64image}"/>est
  </body>
</html>

Ici, la chaîne de caractères reçue de la classe de contrôleur est spécifiée dans `` src '' et affichée.

démo

Accédez à https: // localhost: 8080 / first

Sélectionnez les données d'image de manière appropriée

Appuyez sur le bouton d'envoi pour afficher l'image téléchargée

Pour le moment, je n'ai créé qu'un échantillon. Après cela, veuillez ajouter un chèque ou une fonction à votre guise.

[JAVA] Juste des images d'entrée et de sortie avec Spring MVC