Sending email with inline images via MicrosoftGraph and MicrosoftFlow

/

I had previously written how we can use Send Email as Anyone in Microsoft Graph, and as a bonus wrote a section on how we can use it to send inline images.

There was a small problem - sending email is very hard for app-only permissions - app accounts don’t have email boxes. So for that scenario to work, app accounts need a super crazy “send email as anyone” permission.

Sending email is a lot easier with delegate permission - if we have delegate permission Mail.Send - we can send inline attachments very easily. This is not an admin-tenant approval required permission, so any user can grant this.

Plan

Combine two techniques:

To aad.portal.azure.com

Add Mail.Send (delegate permission)

If you can “grant permissions” to your tenant, doing it here will immediately grant this to your current connection.

Otherwise we have to go back to our Flow connectors and make a new connection for batch.

Create our Flow

Here we are creating a MSGraph mail object JSON getting it ready for send

Using a $batch connector - call /me/sendMail

Results

Inline images are super useful for newsletter or emails where you want to include a nice header, signature or whatever in-between. This is a way to send these with Microsoft Graph and Microsoft Flow.

Resolving Google DNS problems with hosting *.app from Hover on Azure

/

This is a quick blog post - special thanks to Simon Waight who looked into this with me and gave me some nudges towards the right direction. The solution was his suggestion too. That guy, he knows his Azure.

Problem

Okay, checklist of my problems:

  • Bought flowstudio.app domain name with Hover

  • Mapped custom domain on Azure

  • Set CNAME/A record from Hover nameserver to Azure

  • .app needs secure cert - which was bought through Azure (Go-Daddy)

  • DNS lookup is good for almost everyone

  • DNS lookup from Google DNS 8.8.8.8 fails

  • So anyone that uses Google DNS can’t see flowstudio :-(

Notes

Please understand John is a developer and not an infrastructure guru. But this was pretty interesting.

  1. .app is a secured domain

  2. Google DNS fails, because Google owns .app

  3. While most DNS servers are happy to talk to ns.hover.com to resolve my domain name to Azure, Google wants to verify the DNSSEC

  4. This fails, so Google DNS treats the DNS record as invalid, refusing to resolve FlowStudio.app

  5. This was really confusing, until I finally come across a note on Hover’s FAQ:
    https://help.hover.com/hc/en-us/articles/217281647-Understanding-and-managing-DNSSEC

“Please note: Hover does not offer hosted DNSSEC DNS services using ns1/2/3.hover.com. If you require DNSSEC, you’ll need to use a third-party DNS provider that offers DNS that supports DNSSEC fully.”

Solution

The fix is to create a new Azure DNS Zone, and then change the nameserver records on Hover to point to Azure DNS Servers. A/CNAME records are created on Azure DNS. This seems to have resolved the issue for everyone, especially Google DNS.

Please let me know if you have problems accessing https://FlowStudio.app

Decode InfoPath attachments with a bit of JS AzureFunctions

/

Serge, April and me were discussing a problem with pulling out InfoPath Attachment from InfoPath form XML and writing them into a SharePoint document library.

This is a problem I tried to tackle before, but came to realization that I would need an AzureFunction. The main reason is that the InfoPath attachment is a base 64 byte array but the byte array has a variable length header that includes the attachment file name. Flow doesn’t have amazing byte manipulation or left-shift abilities. So we need to write an AzureFunction to help.

As I brood over the problem I also thought it might be easier to handle the byte array with JavaScript. So I gave it a go.

This blog is my version of the answer.

The original decoder code in C#

There is a pretty old MSDN article on the C# code

private void DecodeAttachment(BinaryReader theReader)
{
  //Position the reader to get the file size.
  byte[] headerData = new byte[FIXED_HEADER];
  headerData = theReader.ReadBytes(headerData.Length);

  fileSize = (int)theReader.ReadUInt32();
  attachmentNameLength = (int)theReader.ReadUInt32() * 2;

  byte[] fileNameBytes = theReader.ReadBytes(attachmentNameLength);
  //InfoPath uses UTF8 encoding.
  Encoding enc = Encoding.Unicode;
  attachmentName = enc.GetString(fileNameBytes, 0, attachmentNameLength - 2);
  decodedAttachment = theReader.ReadBytes(fileSize);
}

The updated code in JS AzureFunctions

module.exports = function (context, req) {
    context.log('JavaScript HTTP trigger function processed a request.');
    if (req.body && req.body.file) {
        // https://support.microsoft.com/en-us/help/892730/how-to-encode-and-decode-a-file-attachment-programmatically-by-using-v
        var buffer = Buffer.from(req.body.file, 'base64')
        //var header = buffer.slice(0, 16);  // unused header
        var fileSize = buffer.readUInt32LE(16);  // test is 5923 bytes
        var fileNameLength = buffer.readUInt32LE(20);  // test is 13 chars
        // article lies - it's utf16 now
        var fileName = buffer.toString('utf16le', 24, (fileNameLength-1)*4 -1);  
        var binary = buffer.slice(24 + fileNameLength * 2);
        context.res = {
            // status: 200, /* Defaults to 200 */            
            body: {
                fileName: fileName,
                fileNameLength: fileNameLength,
                fileSize: fileSize,
                fileContent: binary.toString('base64')
            }
        };
    }
    else {
        context.res = {
            status: 400,
            body: "Please pass a base64 file in the request body"
        };
    }
    context.done();
};


The InfoPath form


The Microsoft Flow that coordinates the work


Results

  • Need Azure Function here

  • JavaScript buffer is pretty good at doing byte decoding, easy to read too

  • Debugging and tweaking the byte offset is quite a bit of trial and error, was not expecting that. May be that MSDN article is too old, it is from 2003.

  • You may think - John 2018 is not the right year, or decade to be writing about InfoPath. But hear me out. As companies move their form technology forward, they will need to consider how to migrate the data and attachments in their current InfoPath forms somewhere - having this blog post as a reference is important for that eventual migration. Good luck!

Hiding your Microsoft Flow valuables I mean variables out of sight

/
Photo by Annie Spratt on Unsplash

Photo by Annie Spratt on Unsplash

Today is a quick #FlowNinja post on a strange technique.

Hiding Microsoft Flow valuables I mean variables out of sight

Yes, a very ninja technique.


This is actually an article about how to use tracked properties in the current Flow. But of course that’s the boring side to this. The fun side is how we can attach properties, like having a utility property bag and store properties as we go along!

Start with three compose (I guess we only need two really)

The expression give us the trackedProperties dictionary off the first action

actions('vars')?['trackedProperties']
// vars is the name of the first Compose action

Toggle to the … settings for the first action - that’s where different tracked properties are defined. We can use expressions if prefixed with the “@…” syntax, or define literal strings or numbers or even nested JSON objects.

What could we use Tracked Properties for?

  • Well, hide things that we don’t want to show - like the back of an envelope.

  • Unfortunately, an action can’t reference itself, so we can’t hide secrets that the action itself needs on the back of itself.

  • Tracking time between two actions - calculating the time difference between approvals can be useful.

  • https://flowstudio.app can ‘see’ tracked property values in the detailed Flow Runs - but there are no UI to display this for now. One idea is to use this to surface data within the Flow run that can be observed at the Runs level - like the Trigger URL or List Item ID of the runs, and allowing sorting on them. Powerful ideas but difficult to build an UI for. Let me know if you are keen about how this works below.

Flow Studio Subscription FAQ

/

I added Stripe subscription to Flow Studio today. I also became my first customer (as I’m testing the integration).


Time for this FAQ



How much is a Flow Studio Subscription?

US$10 / month, or US$100 / year.



Is there a trial?

Currently (2018-10-19) the premium features are not blocked by non-subscription status. Everyone is defaulted to Trial status.

In about a month’s time (2018-11-19) a timer job will expire Trial status into Free status, then users will not be able to access subscription features.

The time recurrence job is of course written in Microsoft Flow

Is there a free tier?

Yes! Listing, sorting, metadata grouping, see and filter by runs, triggers and failed runs will all remain in the free tier.

It is our opinion that these features are essential to a pro Flow maker.



What features need a subscription?

Getting Flows as Flow Admin - this requires both Flow Studio subscription and Microsoft Flow Premium 2 - but let you observe all the Flow runs across a tenant / environment.

Edit JSON - this is an advanced feature that is used by Power Users.

There will be additional features as we now focus on making features that will make you love Flow Studio.



What is the coffee donation?

It is a way to let us know that Flow Studio made you smile, but you don’t want a subscription for any reason. It doesn’t grant subscription status.


How did you implement the subscription? Give us the technical blog post!

Flow Studio is an Angular 6 application compiled with AOT and deployed on Azure Functions.

It uses a mixture of LogicApps and Microsoft Flow as serverless middleware. These are proxied behind Azure Functions Proxies.

Timer jobs and triggers coordinate communication between Flow Studio and Stripe payment processor.

This is a blog post on this in the future.



Ask us any questions!

This is an evolving document. Feel free to keep asking us more questions and we’ll provide answers!