<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: sukhleen</title>
    <description>The latest articles on DEV Community by sukhleen (@sukhleen).</description>
    <link>https://dev.to/sukhleen</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F377623%2F96e28103-b8aa-48f7-8a0b-92f0e8cdab67.jpg</url>
      <title>DEV Community: sukhleen</title>
      <link>https://dev.to/sukhleen</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/sukhleen"/>
    <language>en</language>
    <item>
      <title>Sending emails with attachments using Azure Logic Apps</title>
      <dc:creator>sukhleen</dc:creator>
      <pubDate>Fri, 16 Jul 2021 15:23:51 +0000</pubDate>
      <link>https://dev.to/sukhleen/sending-emails-with-attachments-using-azure-logic-apps-3k72</link>
      <guid>https://dev.to/sukhleen/sending-emails-with-attachments-using-azure-logic-apps-3k72</guid>
      <description>&lt;p&gt;Hi, &lt;br&gt;
If you are someone using azure functions and looking for a way to trigger email notifications through your application. You might wanna stick around…&lt;/p&gt;

&lt;p&gt;If you haven't come across logic apps, you must wonder -&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;Why can’t I use sendgrid, nodemailer, or any third party library? I could certainly get email notifications to work with just a bit of code snippet and avoid the complete hustle of creating a new cloud service. no?&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;I’d say, &lt;em&gt;Don’t.&lt;/em&gt;&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;While you are using azure functions and security is the utmost priority to you. You should avoid integrating a third party library for emails.&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;&lt;em&gt;WHYYYYY!!!???&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;Well, for a start -&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;you are most likely to get caught up with domain and sender 
authentication. &lt;/li&gt;
&lt;li&gt;Emails can potentially end up in your spam and you will have to 
follow the steps to set up SPF, DKIM and DMARC for your domain 
and it is not exactly a piece of cake. Furthermore, if not set 
up correctly; you can expect more problems, dear.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;(I will discuss spf, dkim, and dmarc in another article)&lt;/p&gt;

&lt;p&gt;So, here is when logic app will come to the rescue. It will internally validate users as we integrate connectors such as Outlook, Gmail etc. to our application for triggering emails. Therefore, any email sent via logic app will not end up in a spam box for sender/receiver sharing a common connector. for cases where we require multiple connectors, we can create parallel branches to our logic app workflow. &lt;/p&gt;

&lt;p&gt;Logic apps are basically used to design automated workflows which integrate your apps, data, services, and systems.&lt;br&gt;
For example :&lt;br&gt;
◾ Fetching data from blob storage and sending them as attachments &lt;br&gt;
  for email notification.&lt;br&gt;
◾ Move uploaded files from an SFTP or FTP server to Azure Storage.&lt;/p&gt;

&lt;p&gt;While using logic apps, you usually won't have to write any code. However, if you do need to write code, you can create code snippets using Azure Functions and run that code from your workflow. Let’s follow these steps to get started -&lt;/p&gt;

&lt;p&gt;Add a consumption model and proceed with details of assigning resource group, name, subscription to your logic app. Click on &lt;strong&gt;Create and review&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fsxvjj17xznqx7ow876xg.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fsxvjj17xznqx7ow876xg.png" alt="consumption model" width="800" height="72"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Click on Go to resource and select &lt;strong&gt;When a HTTP request is received&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fzmdfw38ujud99x4oa7ha.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fzmdfw38ujud99x4oa7ha.png" alt="HTTP request" width="800" height="248"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Paste the following schema, and copy the URL -&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;{ "type": "object", 
        "properties": {
            "from": { "type": "string" },
            "cc": { "type": "string" },
            "Attachments": { "type": "array" },
            "to": { "type": "string" },
            "subject": { "type": "string" },
            "html": { "type": "string" },
 },
   }

&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F8apv7uv6lugg8lyegtje.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F8apv7uv6lugg8lyegtje.png" alt="schema" width="800" height="263"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;At the bottom of the designer, click New step, type Outlook (you can use any connector eg. Gmail) in the actions search box. Find and select &lt;strong&gt;Send email (V2)&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fj0do5wzf3ggaehv6aaby.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fj0do5wzf3ggaehv6aaby.png" alt="Outlook Connector" width="727" height="258"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Once signed in, click in the &lt;strong&gt;To&lt;/strong&gt; textbox, and the dynamic content dialog appears with properties from JSON schema. Choose accordingly.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fr2gsfu6ne34zuvkz9dt7.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fr2gsfu6ne34zuvkz9dt7.png" alt="dynamic content dialog box" width="800" height="235"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Click on &lt;strong&gt;add new parameter&lt;/strong&gt; for additional fields and select the following&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fyekwxzc3xsi36nvyb81i.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fyekwxzc3xsi36nvyb81i.png" alt="new parameters" width="800" height="281"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;switching to input array for multiple attachments -&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fkbmbes8xzzq7e7ue5w40.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fkbmbes8xzzq7e7ue5w40.png" alt="input array" width="626" height="348"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;In your code, add the following -&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;   const axios = require('axios');

      var msg = {
            "from": "validemail1@domain.com",
            "cc": "testemail1@domain.com;testemail2@domain.com",
            "Attachments": [{
                              ContentBytes: blob.data,
                              Name: "sample-attachment"             
                           }],
            "to": "validemail2@domain.com",
            "subject": "wow!",
            "html": "&amp;lt;!DOCTYPE html&amp;gt;&amp;lt;html&amp;gt;&amp;lt;body&amp;gt;&amp;lt;h1&amp;gt;this is soo 
                     coool&amp;lt;/h1&amp;gt;&amp;lt;/body&amp;gt;&amp;lt;/html&amp;gt;" };

    try {
        const response = await 
        axios.post(process.env.LOGIC_APP_URL, msg);
        console.log(response.status);
    } catch (error) {
        console.log(error);
    }
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;NOTE&lt;/strong&gt;&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;the 'from' address needs to be from one of the connections you 
have verified through outlook signin in the logic apps 
designer. if any other address, it will throw the error - 
user is not "Authorised" to send the email.&lt;/li&gt;
&lt;li&gt;the ContentBytes property for an Attachment object should be 
base64 encoded. I have fetched the 'blob' in code from a 
storage container through internal API; you can directly fetch 
from storage container by calling it through logic apps 
designer as well.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;Now as per the code snippet, Let's include the LOGIC_APP_URL in our environment variables.&lt;br&gt;
Open App Service on azure portal,&lt;br&gt;
create a LOGIC_APP_URL key/value pair in configuration&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fse0pbrdto1ex3tkablzu.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fse0pbrdto1ex3tkablzu.png" alt="configuration" width="800" height="359"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;thats it! you're all set with a simple logic app email trigger service.&lt;/p&gt;

</description>
      <category>azure</category>
      <category>node</category>
      <category>email</category>
      <category>logicapps</category>
    </item>
  </channel>
</rss>
