Send an Email with Attachment in Intelligent Advisor

No prizes for guessing that this is a continuation of the previous post about sending an email in Intelligent Advisor. If we look at the concept discussed in the previous article, we can send an email during an Interview. For example, we could send it on the last page just so that we keep in touch with our citizen or whatever. We want to Send an Email with Attachment!

So the next logical step is, we want to Send an Email with Attachment – send them the interesting PDF file that we prepared for them. Maybe you even gave them the file during the interview. But how do you know they read it / opened it? Of course there are ways to “force” the user to do that but let’s assume you want a belt and braces version and you intend to send them the file as well.

Our starting point has to be, once again, that constraints that exist mean we need to send this from the client – or at least we need to initiate the sending from the client, much like the previous post. There are several ways to do this but the suggested approach below tries to tick a few extra boxes:

  1. We want to be able to send a variety of different emails, depending on the scenario. And we ideally don’t want to have all that sitting in the JavaScript file.
  2. We would like to have attachments included
  3. We would like to continue using Mailgun, as we did in the previous example.

So now we hit a potential roadblock – Mailgun wants PDF files to be attached with a real file path. And our PDF files don’t have that at all. They are dynamic files that are created when you click the link in an Interview:

Send an Email with Attachment - Problem

So we cannot give Mailgun a file path, since the path you see in the image above does not point to the file. It points to the thing that will generate the file. So in a sense, when you click on the link, the file does not exist yet (notice how the Link above does not contain the “MyFile.PDF” at the end of it that you might expect. So Mailgun does not want to play.

Before we look at how to send an Email with Attachment, let’s consider the other box I wanted to tick – I don’t want to have to store the entire message text in my JavaScript. I want to have multiple message templates, and be able to call the template, pass some data and then just get on with sending the mail. Put simply, I don’t want to have to build a mime message or a complicated construct in code. I just want to say “Send email of type A” and say “here’s the address and the attachment, just do it!”. A bit like old-fashioned mail-merge if you like.

Enter EmailJS. This tool can exist on it’s own but it also sits happily on top on of Mailgun, adding a layer of abstraction. Here is an example of an email template made in EmailJS. Note that I have standard text, dynamic text, and dynamic attachments.

In the code therefore we can just call the service, and provide the variables needed. Note in the example below how each data item corresponds to the different variables in the template:

Send an Email with Attachment - Solution

But we are getting ahead ourselves. How did we get the PDF into that variable “emailform”? Well we have to do it in stages. We can grab the PDF in the following way in order to Send an Email with Attachment:

var xhr = new XMLHttpRequest();
						xhr.open("GET", attachmenturl, true);
						xhr.responseType = "blob";
						xhr.onload = function (e) {
							if (this.status === 200) {
								// GET THE BLOB RETURNED FROM THE GET CALL TO THE ATTACHMENT
								blob = this.response;
								var promise = getBase64(blob);
								// WHEN ALL THE BLOB > BASE64  HAS BEEN PROCESSED, CALL EMAILJS 
								promise.then(function (result) {
									base64String = result;
									var data = {
										"user_id": "XXXXXXXX",
										"service_id": "default_service",
										"template_id": "template_yxvbd2n",
										"template_params": {
											'email_address': emailaddress,
											'from_name': 'test@news.theopahub.com',
											'message': body,
											'emailform': base64String
										}
									}
									body = encodeURI(body);
									// CALL EMAILJS 
									$.ajax('https://api.emailjs.com/api/v1.0/email/send', {
										type: 'POST',
										data: JSON.stringify(data),
										contentType: 'application/json'
									}).done(function () {
										interview.setInputValue("emailresponder", "Mail Server Responded OK");
									}).fail(function (error) {
										interview.setInputValue("emailresponder", "Mail Server Responded " + JSON.stringify(error));
									});
								});
							}
						};
						// MAKE THE CALL TO GET THE PDF
						xhr.send();

Note how we need to wrap everything up in a process to ensure that the download of the PDF and the capture of the blob is done before we actually send the email.

The result is an email with the attachment duly sent to the lucky recipient’s inbox. If you are interested the sample Zip file is available for free in the Intelligent-Advisor.com shop. Of course you will need EmailJS and Mailgun subscriptions for it to work!

Details of Mailgun and EmailJS are available online. If you are interested in reading the original discussion that generated this article series see the posts here.

Richard Napier

Author: Richard Napier

Richard Napier joined Siebel Systems in 1999 and took up the role of managing the nascent Siebel University in Southern Europe. He subsequently was Director of Business Development and Education for InFact Group (now part of Business & Decisions) for 8 years. He now runs his Consulting and mentoring company, On Demand Consulting & Education Ltd and has run ODCE since 2010. Owner of intelligent-advisor.com, he also is Co-Founder of the Siebel Hub.

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Worldwide
Logo by Southpaw Projects LLC