How can I send an email with my outlook add-in - outlook

Question

my friends and I are making an outlook add-in that can take the text from an email in the user's inbox and send it to our email address.
the email part of this is proving to be very difficult.
So far we have tried to do this with nodemailer and similar modules but from what I can tell you would need a server which we would like to avoid.
To get around this we copied some code and made a website that sends the email for us. The problem with this is we cant figure out how to do this all within the taskpane which you can see in the first image. When we click 'submit' nothing will happen until we open the same thing in a separate HTML popup which can be seen in image 2.
Is there a way to do this only from the taskpane so that all the user has to do is click one button that will both take the text and send it to us automatically? If there isn't, how do we get the content of the email from the task pane to the popout (from the right side of image two to the left side)?

Answer 1

You can use makeEwsRequestAsync() to send an email. Here is a sample you could adjust. (note this example sends a mail with the version number of Outlook in the body, but you can adjust it to put whatever data you want inside). See documentation for makeEwsRequestAsync, to see what else it supports that may solve your scneario: https://learn.microsoft.com/en-us/office/dev/add-ins/outlook/web-services
var request = '<soap:Envelope xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:m="http://schemas.microsoft.com/exchange/services/2006/messages" xmlns:t="http://schemas.microsoft.com/exchange/services/2006/types" xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/">'+
' <soap:Header><t:RequestServerVersion Version="Exchange2010" /></soap:Header>'+
' <soap:Body>'+
' <m:CreateItem MessageDisposition="SendAndSaveCopy">'+
' <m:SavedItemFolderId><t:DistinguishedFolderId Id="sentitems" /></m:SavedItemFolderId>'+
' <m:Items>'+
' <t:Message>'+
' <t:Subject>Hello, Outlook!</t:Subject>'+
' <t:Body BodyType="HTML">This message was sent from ' + Office.context.mailbox.diagnostics.hostName + ', version ' + Office.context.mailbox.diagnostics.hostVersion + '!</t:Body>'+
' <t:ToRecipients>'+
' <t:Mailbox><t:EmailAddress>' + Office.context.mailbox.userProfile.emailAddress + '</t:EmailAddress></t:Mailbox>'+
' </t:ToRecipients>'+
' </t:Message>'+
' </m:Items>'+
' </m:CreateItem>'+
' </soap:Body>'+
'</soap:Envelope>';
Office.context.mailbox.makeEwsRequestAsync(request, function (asyncResult) {
if (asyncResult.status == "failed") {
console.log("Action failed with error: " + asyncResult.error.message);
}
else {
console.log("Message sent!");
}
});
You could also use displayNewMessageFormAsync() https://learn.microsoft.com/en-us/javascript/api/outlook/office.mailbox?view=outlook-js-preview#outlook-office-mailbox-displaynewmessageformasync-member(1)
If you want to create a new mail UI, that the user has to send manually.

Answer 2

The response above is showing how to send an email using EWS. (Exchange Web Services). however, the question is also asking how to send the body of the message.
in order to get the body you need to call the body.getAsync() method, check our the sample.
function getSelectedData() {
Office.context.mailbox.item.body.getAsync("html" /*you can also do 'text' */, function(result){
console.log(result.value);
});
}
you can also use the consume the Microsoft Graph from the Office Add-in (instead of EWS) check out this video on how to do it. Here is how to use the Graph to send an e-mail for reference.