Email with Attachments via Spring and SendGrid (Part 1)

Introduction

In this article, we will study how to send emails and include attachments using Spring as our Java framework, SendGrid as our email service, and jQuery-File-Upload as our jQuery plugin. This article is the culmination of my previous articles about email and file upload (see below)

• Email with Spring and SendGrid tutorial
• File Upload with Spring and jQuery tutorial

I advise my readers to read those articles first before reading this guide to understand how to send email with SendGrid and how to upload files with jQuery.

Table of Contents

Part 1: Introduction and Functional Specs
Part 2: Java classes
Part 3: XML configuration
Part 4: HTML form
Part 5: Running the Application

Dependencies

• Spring core 3.1.0.RELEASE
• SendGrid account (you're required to sign-up first)
• jQuery-File-Upload
• See pom.xml for details

Github
To access the source code, please visit the project's Github repository (click here)

Functional Specs

Let's define our application's requirements:

• Create a simple form where users can compose and send emails
• Emails do not need to be persisted in a database
• Users can attach multiple files
• Send email via HTTP instead of SMTP to avoid firewall issues

Here's our Use Case diagram:

[User]-(Compose)
[User]-(Attach)
[User]-(Send)

What is SendGrid?

SendGrid's cloud-based email infrastructure relieves businesses of the cost and complexity of maintaining custom email systems. SendGrid provides reliable delivery, scalability and real-time analytics along with flexible API's that make custom integration a breeze.

Source: http://www.sendgrid.com

Screenshots

Let's preview how our application will look like after it has been completed. This is also a good way to clarify further our application's specs

Compose email form
This is the entry page where users can compose and send emails.

Email with attachments
Notice we can attach multiple files and display their file sizes

Success alert
After clicking "Send", the email message is sent. An alert is shown to confirm the action.

Reset alert
When user clicks on "Reset", the contents of the fields are cleared. An alert is shown to confirm the action.

Sample emails
This is the sample email received from Gmail:

This is the sample email received from Yahoo:

Next

In the next section, we will start writing the Java classes, discuss the jQuery-File-Upload process, and the SendGrid API for sending attachments. Click here to proceed.