Friday, 21 October 2016

This tutorial shows how to implement a Java web application that uploads files to server and save the files into database.
The application applies the following technologies:
    • Servlet 3.0: Using Servlet 3.0 we can write code to handle file upload easily. For detailed explanation of how to upload file with Servlet 3.0, read the tutorial
    • MySQL database 5.5: We will store uploaded files in MySQL database. For more details about how to store files in MySQL database, read the article       
    • The application will consist of the following source files:
        • Upload.jsp: presents a form which allows users entering some information (first name and last name), and picking up a file (a portrait image).
        • FileUploadDBServlet: captures input from the upload form, saves the upload file into database, and forwards the users to a message page.
        • Message.jsp: shows either successful or error message.
      Now, let’s go through each part of the application in details.

      1. Creating MySQL database table

      First, let’s create a database and a table in MySQL. Execute the following script using either MySQL Command Line Clientor MySQL Workbench:
    • create database AppDB;
       
      use AppDB;
       
      CREATE TABLE `contacts` (
        `contact_id` int(11) NOT NULL AUTO_INCREMENT,
        `first_name` varchar(45) DEFAULT NULL,
        `last_name` varchar(45) DEFAULT NULL,
        `photo` mediumblob,
        PRIMARY KEY (`contact_id`)
      ) ENGINE=InnoDB DEFAULT CHARSET=latin1

The script will create a database named AppDB and a table named contacts. File will be stored in the column photo which is of type mediumblob which can store up to 16 MB of binary data. For larger files, use longblob (up to 4 GB).

2. Coding upload form page

Write code for the upload form as follows (Upload.jsp):

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>File Upload to Database Demo</title>
</head>
<body>
    <center>
        <h1>File Upload to Database Demo</h1>
        <form method="post" action="uploadServlet" enctype="multipart/form-data">
            <table border="0">
                <tr>
                    <td>First Name: </td>
                    <td><input type="text" name="firstName" size="50"/></td>
                </tr>
                <tr>
                    <td>Last Name: </td>
                    <td><input type="text" name="lastName" size="50"/></td>
                </tr>
                <tr>
                    <td>Portrait Photo: </td>
                    <td><input type="file" name="photo" size="50"/></td>
                </tr>
                <tr>
                    <td colspan="2">
                        <input type="submit" value="Save">
                    </td>
                </tr>
            </table>
        </form>
    </center>
</body>
</html>



This page shows two text fields (first name and last name) and a file field which allows the users choosing a file to upload. The action attribute of this form is set to uploadServlet which is URL mapping of the servlet we will create in the next section.

3. Coding file upload servlet

Create a servlet class named FileUploadDBServlet.java with the following code:


No comments:

Post a Comment