Mastering HTTP Triggers in Power Automate

#powerautomate #powerfuldevs #powerplatform #tutorial

HTTP triggers in Power Automate provide a valuable functionality for initiating flows in various scenarios such as retrieving or submitting data to an external system. HTTP trigger flows become particularly useful when an existing connector lacks a specific trigger point. Additionally, these HTTP triggers are handy when data needs to be passed from an external application/third-party applications and other services like SharePoint.

In other words, if you want to trigger your flow from a connector that's not available in Power Automate, this technique is the way to go.

Scenario

I created an SPFx extension that I named 'Suggestion Box', and I want to be able to trigger a Power Automate flow from this SPFx application.

Instant flow - Trigger

Select "When an HTTP request is received" trigger

Click on 'Use sample payload to generate schema' to create a JSON structure for passing the data. Once done, it will automatically generate the Request Body JSON Schema, and you can select the 'Post' method.

Click "Done" and the JSON schema will be generated.

When this endpoint is triggered, it requires three properties: siteUrl, pageTitle, and suggestionBody

Action

Specifically for my application, I want the flow to send me the suggestionBody via email.
And now, if we look at the Dynamic content, we can see that we have the siteUrl, pageTitle, and suggestionBody variables.

Click "Save" and the "HTTP POST URL" will be created

Add a new step "Response"-ation select cthe "Body" property from the dynamic content

Test the HTTP request with Postman

Select POST as method
Copy the HTTP POST URL you got when you saved the flow and specify the endpoint
Create a JSON sample in the body
Add header: Content-type=application/json
Send the request and check your email

Invoke the Power Automate flow from SPFx solution

Import the following code snippet in your tsx file:

import { HttpClient, HttpClientResponse, IHttpClientOptions } from '@microsoft/sp-http';
It will import the necessary modules (HttpClient, HttpClientResponse and IHttpClientOptions) from the @microsoft/sp-http package.

Add the following function to trigger the Power Automate flow

Note: Replace the "postURL" with the actual HTTP POST URL generated in your trigger.

async function sendSuggestion(
siteUrl: string, 
pageTitle: string, 
suggestionBody: string
): Promise<HttpClientResponse> {

        const postURL = <PASTE HERE HTTP POST URL>;

        const body: string = JSON.stringify({
            siteUrl: siteUrl,
            pageTitle: pageTitle,
            suggestionBody: suggestionBody,
          });

          const requestHeaders: Headers = new Headers();

          requestHeaders.append('Content-type', 'application/json');

          const httpClientOptions: IHttpClientOptions = {
            body: body,
            headers: requestHeaders,
          };

          console.log("Sending Suggestion");

          return props.context.httpClient.post(
            postURL,
            HttpClient.configurations.v1,
            httpClientOptions
          ).then((response: HttpClientResponse): Promise<HttpClientResponse> => {

            console.log("Suggestion sent.");

            return response.json();

          });
        }