How to Send Images as Attachments with Mailgun and Node.js?

Question

I am attempting to send images as attachments to emails but I am having trouble figuring out how to accomplish this.

I am using Mailgun to send the mail, Cloudinary to upload the images, MongoDB as my database, and Node.js/Express as my backend.

The user process goes like this:

• User submits pictures onto the site
• Pictures are uploaded via Cloudinary and the direct link to each image is saved in the MongoDB database
• Mail goes out via Mailgun to inform users of the new post with links to the images in the body

Obviously this is not ideal because you need to click on each link individually to see and download the images. I would like to attach them directly to the email so the user has an easier time downloading the images.

I have looked at the documentation for Mailgun but it doesn't seem like non-local images can be sent as attachments. Is there something I'm missing?

I have tried using the 'inline' and 'attachment' parameters for Mailgun but I end up with an error message stating the file/directory cannot be located.

var pictures = [];
        post.images.forEach(function(photos){
            pictures.push(photos + " ");
            return pictures;
        });

var attch = new mailgun.Attachment({data: pictures[0], filename: "picture"});
        var data = {
            from: "email <[email protected]>",
            to: "[email protected]",
            subject: 'this is an email',
            html: 'here is a new post and here are the images in that post',
            attachment: attch
        };

The expected result is an email with the attached images of the new post, or in this case a single image from that post.

The actual result is this error message:

events.js:183
  throw er; // Unhandled 'error' event
  ^

Error: ENOENT: no such file or directory, stat 'https://res.cloudinary.com/user/image/upload/image.jpg '

Underbelly

If you have Image URL and it's public then you can show your images in HTML body. And one more option you can download images in local /tmp directory and then pass image url in attachment key : attachment: ['/tmp/abc.png','/tmp/xyz.jpg'] – Pentatomic

Answer 1

mailgun.js package will accept attachment as file path, buffer and stream. To attach your image from external URL use stream,

var request = require('request');
var image = request(pictures[0]);
var data = {
    from: "email <[email protected]>",
    to: "[email protected]",
    subject: 'this is an email',
    html: 'here is a new post and here are the images in that post',
    attachment: image
};

Here is the sample code from mailgun.js

var request = require('request');
var file = request("https://www.google.ca/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png");

var data = {
  from: 'Excited User <[email protected]>',
  to: '[email protected]',
  subject: 'Hello',
  text: 'Testing some Mailgun awesomeness!',
  attachment: file
};

mailgun.messages().send(data, function (error, body) {
  console.log(body);
});

Reference : https://www.npmjs.com/package/mailgun-js#attachments

Epicycle

@JordanPisani did you get it working with multiple images? – Jessalyn

@Jessalyn Yep, refer to this thread. – Underbelly

Answer 2

Using axios and multiple files

const downloadFile = (link: Link) =>
  axios.get(link, {
    responseType: 'stream', // Important
  });

const files = fileLinks // example: ["http://example.com/1.png", "http://example.com/2.png"]
   .map((link) => downloadFile(link))
   .map((response) => response.data)


const data = {
  from: 'Template from <[email protected]>',
  to: '[email protected]',
  subject: 'Title',
  text: 'Test text',
  attachment: files 
};

Trevethick