Unggah File dengan Spring MVC

1. Ikhtisar

Di artikel sebelumnya, kami memperkenalkan dasar-dasar penanganan formulir dan menjelajahi pustaka tag formulir di Spring MVC.

Pada artikel ini, kami fokus pada apa yang Spring tawarkan untuk dukungan multibagian (unggahan file) di aplikasi web.

Spring memungkinkan kami mengaktifkan dukungan multi bagian ini dengan objek MultipartResolver yang dapat dicolokkan . Kerangka kerja ini menyediakan satu implementasi MultipartResolver untuk digunakan dengan Commons FileUpload dan lainnya untuk digunakan dengan penguraian permintaan multipart Servlet 3.0 .

Setelah mengonfigurasi MultipartResolver, kita akan melihat cara mengunggah satu file dan banyak file.

Kami juga akan menyentuh Spring Boot.

2. FileUpload Commons

Untuk menggunakan CommonsMultipartResolver untuk menangani pengunggahan file, kita perlu menambahkan ketergantungan berikut:

 commons-fileupload commons-fileupload 1.3.1 

Sekarang kita dapat mendefinisikan bean CommonsMultipartResolver ke dalam konfigurasi Spring kita.

MultipartResolver ini hadir dengan serangkaian metode set untuk menentukan properti seperti ukuran maksimum untuk unggahan:

@Bean(name = "multipartResolver") public CommonsMultipartResolver multipartResolver() { CommonsMultipartResolver multipartResolver = new CommonsMultipartResolver(); multipartResolver.setMaxUploadSize(100000); return multipartResolver; }

Di sini kita perlu mengontrol properti yang berbeda dari CommonsMultipartResolver dalam definisi Bean itu sendiri.

3. Dengan Servlet 3.0

Untuk menggunakan penguraian multi bagian Servlet 3.0 , kita perlu mengkonfigurasi beberapa bagian aplikasi. Pertama, kita perlu menyetel MultipartConfigElement di registrasi DispatcherServlet :

public class MainWebAppInitializer implements WebApplicationInitializer { private String TMP_FOLDER = "/tmp"; private int MAX_UPLOAD_SIZE = 5 * 1024 * 1024; @Override public void onStartup(ServletContext sc) throws ServletException { ServletRegistration.Dynamic appServlet = sc.addServlet("mvc", new DispatcherServlet( new GenericWebApplicationContext())); appServlet.setLoadOnStartup(1); MultipartConfigElement multipartConfigElement = new MultipartConfigElement(TMP_FOLDER, MAX_UPLOAD_SIZE, MAX_UPLOAD_SIZE * 2, MAX_UPLOAD_SIZE / 2); appServlet.setMultipartConfig(multipartConfigElement); } }

Di objek MultipartConfigElement , kami telah mengonfigurasi lokasi penyimpanan, ukuran file individu maksimum, ukuran permintaan maksimum (dalam kasus beberapa file dalam satu permintaan), dan ukuran di mana kemajuan unggahan file dialihkan ke lokasi penyimpanan.

Pengaturan ini harus diterapkan pada tingkat pendaftaran servlet, karena Servlet 3.0 tidak mengizinkannya untuk didaftarkan di MultipartResolver seperti halnya dengan CommonsMultipartResolver.

Setelah ini selesai, kita dapat menambahkan StandardServletMultipartResolver ke konfigurasi Spring kita:

@Bean public StandardServletMultipartResolver multipartResolver() { return new StandardServletMultipartResolver(); }

4. Mengupload File

Untuk mengunggah file kita, kita dapat membuat formulir sederhana di mana kita menggunakan tag input HTML dengan type = 'file'.

Terlepas dari konfigurasi penanganan unggahan, kami telah memilih, kami perlu mengatur atribut pengkodean formulir ke multipart / form-data. Ini memungkinkan browser mengetahui cara menyandikan formulir:


    
Select a file to upload

Untuk menyimpan file yang diupload kita dapat menggunakan variabel MultipartFile . Kita dapat mengambil variabel ini dari parameter request di dalam metode pengontrol kita:

@RequestMapping(value = "/uploadFile", method = RequestMethod.POST) public String submit(@RequestParam("file") MultipartFile file, ModelMap modelMap) { modelMap.addAttribute("file", file); return "fileUploadView"; } 

Kelas MultipartFile menyediakan akses ke detail tentang file yang diunggah , termasuk nama file, jenis file, dan sebagainya. Kita dapat menggunakan halaman HTML sederhana untuk menampilkan informasi ini:

Submitted File

OriginalFileName: ${file.originalFilename}
Type: ${file.contentType}

5. Mengupload Banyak File

Untuk mengunggah banyak file dalam satu permintaan, kami cukup meletakkan beberapa bidang file input di dalam formulir:


    
Select a file to upload
Select a file to upload
Select a file to upload

Kita perlu berhati-hati bahwa setiap field input memiliki nama yang sama sehingga dapat diakses sebagai array MultipartFile :

@RequestMapping(value = "/uploadMultiFile", method = RequestMethod.POST) public String submit(@RequestParam("files") MultipartFile[] files, ModelMap modelMap) { modelMap.addAttribute("files", files); return "fileUploadView"; } 

Sekarang, kita cukup mengulang array itu untuk menampilkan informasi file:

   Spring MVC File Upload   

Submitted Files

OriginalFileName: ${file.originalFilename}
Type: ${file.contentType}

6. Mengupload File Dengan Data Formulir Tambahan

Kami juga dapat mengirimkan informasi tambahan ke server bersama dengan file yang diunggah. Kami hanya perlu memasukkan bidang wajib dalam formulir:


    
Name
Email
Select a file to upload

Di pengontrol, kita bisa mendapatkan semua data formulir menggunakan anotasi @RequestParam :

@PostMapping("/uploadFileWithAddtionalData") public String submit( @RequestParam MultipartFile file, @RequestParam String name, @RequestParam String email, ModelMap modelMap) { modelMap.addAttribute("name", name); modelMap.addAttribute("email", email); modelMap.addAttribute("file", file); return "fileUploadView"; }

Mirip dengan bagian sebelumnya, kita dapat menggunakan halaman HTML dengan tag JSTL untuk menampilkan informasi.

Kita juga dapat merangkum semua bidang formulir dalam kelas model dan menggunakan anotasi @ModelAttribute di pengontrol. Ini akan membantu ketika ada banyak bidang tambahan bersama dengan file tersebut. Mari kita lihat kodenya:

public class FormDataWithFile { private String name; private String email; private MultipartFile file; // standard getters and setters }
@PostMapping("/uploadFileModelAttribute") public String submit(@ModelAttribute FormDataWithFile formDataWithFile, ModelMap modelMap) { modelMap.addAttribute("formDataWithFile", formDataWithFile); return "fileUploadView"; }

7. Unggah File Spring Boot

Jika kami menggunakan Spring Boot, semua yang kami lihat sejauh ini masih berlaku.

Namun, Spring Boot membuatnya lebih mudah untuk mengonfigurasi dan memulai semuanya dengan sedikit kerumitan.

In particular, it's not necessary to configure any servlet, as Boot will register and configure it for us, provided that we include the web module in our dependencies:

 org.springframework.boot spring-boot-starter-web 2.1.8.RELEASE 

We can find the latest version of spring-boot-starter-web on Maven Central.

If we want to control the maximum file upload size, we can edit our application.properties:

spring.servlet.multipart.max-file-size=128KB spring.servlet.multipart.max-request-size=128KB

We can also control whether file uploading is enabled, and the location for file upload:

spring.servlet.multipart.enabled=true spring.servlet.multipart.location=${java.io.tmpdir}

Note that we've used ${java.io.tmpdir} to define the upload location so that we can use the temporary location for different operating systems.

8. Conclusion

Di artikel ini, kami melihat berbagai cara untuk mengonfigurasi dukungan multi-bagian di Spring. Dengan menggunakan ini, kami dapat mendukung unggahan file di aplikasi web kami.

Implementasi tutorial ini dapat ditemukan di proyek GitHub. Ketika proyek berjalan secara lokal, contoh formulir dapat diakses di // localhost: 8080 / spring-mvc-java / fileUpload