DEV Community

Cover image for Send e-mails directly from front-end with JavaScript 💥💥

Send e-mails directly from front-end with JavaScript 💥💥

Mateusz Iwaniuk on April 23, 2020

My code from project is available here: https://github.com/Iwaniukooo11/email-sender Nowadays, when creating even basic websites, programmers are ...
Collapse
 
mikenikles profile image
Mike

I'm curious to understand the security of this solution. If I visit your site, could I not take your USER_ID and send emails on your behalf?

Collapse
 
iwaniukooo11 profile image
Mateusz Iwaniuk

Hi, at first I want to thank you all for taking part in discussion.
In my project I have used webpack and gulp thanks to what finished JS code is bundled and minified, which makes searching IDs harder.
Problems with visible of API is not a problem of this package, but of the entire front-end. Even when you want to fetch f.e Pizza API, you might be obliged to pass your private key, which later will be visible in dev tools.
In my article I have bundled and minified code which is in seperated file. It is still more safer than keeping everything in HTML file, what was shown on this documentation part

Collapse
 
veebuv profile image
Vaibhav Namburi

I believe a solution like this would work due to domain restrictions. I.e you can take the keys and user ID, but can only send/activate the service if the domain matches

Collapse
 
franky47 profile image
François Best • Edited

You could probably use that USER_ID from the devtools console of the appropriate domain and send whatever you want, impersonating the domain owner.

Edit: the FAQ of the service indicates you can only send predefined template emails, but template variable injection could be abused.

Thread Thread
 
mikenikles profile image
Mike

Yeah that's somewhat a relief 😅. As a bad actor, I could still send thousands of messages, potentially causing increased cost or worse, the email account getting blocked.

This service seems convenient at first, but with today's serverless solutions it's worth building a backend solution that is properly secured.

Thread Thread
 
xr0master profile image
Sergey Khomushin

There is no way you can solve this problem by creating your solution. As a bad guy, I can just as well call your API for your form.

Collapse
 
patricnox profile image
PatricNox

Very true. An OAuth token should always be used in these API scenarios which does more than only being used for a getter.

Collapse
 
xr0master profile image
Sergey Khomushin

What prevents from calling the API using an access token (from OAuth)?

Collapse
 
aajahid profile image
Abdullah Al Jahid

I think your post title is misleading. What you explained is exactly what everyone is doing. Sending a request from frontend to backend ( in your case a 3rd party service provider ).

Collapse
 
iwaniukooo11 profile image
Mateusz Iwaniuk • Edited

Hi Abdullah,
Someone earlier has mentioned that, let me show you my point of view
This article is intended for developers, who don't want to use any back-end technologies. Of course - it is true that EmailJS uses its 3rd party provider but you, as a programmer, don't have to take care about that. The main point is that you don't have to use node.js or php, but you can send email using simple package on your front-end side

Collapse
 
marwanm_dev profile image
Marwan mostafa

That's Cool, Another method is by using Formspree either way In the past I wasn't expecting its simplicity.

Collapse
 
iwaniukooo11 profile image
Mateusz Iwaniuk • Edited

Well, that's right, but this article is intended for developers, who don't want to use any back-end technologies. Of course - it is true that EmailJS uses back-end on its side, but you, as a programmer, don't have to take care about that

Collapse
 
xr0master profile image
Sergey Khomushin

Does the end user/developer really matter how it happens?

Collapse
 
kirkovg profile image
Gjorgji Kirkov

Hi Mateusz, it seems that the link to the repo is broken :/

Collapse
 
iwaniukooo11 profile image
Mateusz Iwaniuk

I'm sorry, it is fixed now 😅