The Java component Commons fileUpload implements the file upload function

The Commons fileUpload jar package provided by Apache is really simple to upload files. Recently, I want to use servlet / JSP to do an image upload function. I found a lot of information on the Internet, mostly based on Struts framework. Although some also introduce the upload of common fileUpload, those examples are relatively old, and some classes are now abandoned.

***

Case scenario

A library background management interface needs to provide the function of uploading Book pictures and finally display them on the page.

Realization effect

Enter the page of adding books. By default, a picture "no breakthrough" (both length and width are 200px) is displayed, and a button "upload picture" is provided, as shown in the following figure.

Click the "upload picture" button to pop up the upload interface through the mode window, as shown in the figure below.

Select the specified picture through the "Browse" button and click the "Upload" button to upload. If the upload is successful, a success prompt will pop up. After clicking "OK", the user will close the pop-up window and automatically display the new picture on the page, as shown in the following figure.

code implementation

① First create an add book page: bookadd jsp

The page ID is photo_ The hidden tag of ID is used to store the picture path to facilitate submission to the background and storage in the database. The ID is img_ The < img > tag of ID is used to display pictures. All pictures are stored under the server for easy reading. Then a key JS, click button to pop up the upload page through the mode window. When the mode window pops up, a variable win is defined, which is used to obtain the image path value returned by the mode window.

(Note: due to security problems, pictures cannot be stored at will. When the project is deployed in the server, pictures can only be viewed under the server. If you have to read pictures not under the current server, you need to configure the virtual directory of the server.)

② Create an upload picture page, bookupload jsp

Note that the < base > tag must be defined. The data can be returned to the parent form only when the current mode window is closed. The < form > tag also needs to set an attribute enctype = "multipart / form data" so that the submitted file can be obtained in the background. Click the "upload" button to transfer the file to the background. The rest is the background upload processing.

③ Create an ordinary servlet. Only some key codes are provided below

The red code part is the key code uploaded, and the others are used as embellishment. After completing these three steps, a simple upload is realized.

The above is the whole content of this article. I hope it will be helpful to your study, and I hope you can support programming tips.