Upload handling

Your application may have forms with which visitors can upload images. For example, the State Department has an Upload Photo page for submitting a photograph when applying for passports.

In HTML development, uploading a file requires a form on the client with an attribute enctype="multipart/form-data", and the form itself contains an element <input type="file">.

In the following example, you implement a front-end form and back-end class that uploads an image and saves it using the default storage configuration defined in context.xml. The upload method from the browser is post.

Step 1: Implement HTML form

Implement an HTML form in a template.

HTML form for uploading a file:

showLineNumbers {3,4}

1
<h2>Upload File</h2>
2

3
<form enctype="multipart/form-data" method="post" action="/upload-servlet">
4
    <p><input type="file" name="file" /></p>
5
    <p><input type="text" name="description" /></p>
6
    <p><input type="submit" /></p>
7
</form>

• 3. Provides the upload method (post) and specifies the back-end servlet processing the uploaded form (upload-servlet).
• 4. Provides the name attribute for the file in the uploaded form.

You’ll use both of these attributes when implementing the upload servlet.

Step 2: Implement upload servlet

Implement a servlet that accepts the uploaded form and saves the image to storage.

showLineNumbers {13,16,18,20,24}

1
import com.psddev.dari.util.ObjectUtils;
2
import com.psddev.dari.util.StorageItem;
3
import com.psddev.dari.util.StorageItemFilter;
4

5
import javax.servlet.ServletException;
6
import javax.servlet.annotation.WebServlet;
7
import javax.servlet.http.HttpServlet;
8
import javax.servlet.http.HttpServletRequest;
9
import javax.servlet.http.HttpServletResponse;
10
import java.io.IOException;
11
import java.io.PrintWriter;
12

13
@WebServlet("/upload-servlet")
14
public class UploadServlet extends HttpServlet {
15

16
    @Override
17
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
18
        StorageItem storageItem = StorageItemFilter.getParameter(request,"file", null);
19

20
        Map<String, Object> properties = new HashMap<String, Object>();
21
        properties.put("path", storageItem.getPath());
22
        properties.put("storageName", storageItem.getStorage());
23

24
        response.setContentType("application/json");
25
        PrintWriter out = response.getWriter();
26
        out.print(ObjectUtils.toJson(properties));
27
        out.flush();
28
    }
29
}

• 13. Associates the servlet with the action specified in "HTML form for uploading a file."
• 16. Overrides the doPost method. We use this method because the upload form in "HTML form for uploading a file" specifies method=post.
• 18. Extracts the file from the form data using the value specified in the upload form name=file. The last parameter, null, indicates Brightspot uses the default storage item configuration appearing in the Tomcat context.xml file. For information about configuring storage items, see Configuring StorageItem.
• 20. Builds a map of key-value pairs describing the file’s storage characteristics. For additional methods available for examining the uploaded file, see Interface StorageItem.
• 24. Builds a JSON object from the map and returns it to the client.

showLineNumbers

1
{
2
  "path": "33/c7/f340bec94c21b7e88687c4f78fa4/dragon-slayer.jpg",
3
  "storageName": "tutorial.local"
4
}

StorageItemFilter provides useful methods for extracting uploaded files from an uploaded form. For details, see Class StorageItemFilter.

See also:

• Creating StorageItems
• Configuring StorageItem