How to call a Power automate flows from Power Pages portal? Exploring the new integration of cloud flows with Power Pages.

Hello everyone and welcome to my blog. In today’s blog, I will show how you can call a Power Automate flow from Power Pages portal.

Invoking Power Automate flows from Power Pages/ Power Apps portals is nothing new. Until this time, we would create a Power Automate flow with HTTP trigger. And invoke the Power Automate flow using JavaScript from portal pages.

But the problem was security was lacking. Power Automate flows with HTTP trigger can be invoked without any authentication by just using the URL of the portal.

But now with the newly introduced feature of Power Automate integration with Power Pages portal, you can implement security to control who can invoke the Power Automate flow from your pages. And not to forget, we can define our custom input and output parameters.

Let’s get started. Navigate to your Power Pages portal studio and click on the Setup workspace and then click on Cloud Flows.

Click on ‘Create new Flow‘.

We will use the ‘Power Pages‘ connector and ‘When Power Pages calls a flow‘ action.

You have the provision to provide input parameters. I have created a new input parameter SearchText. You can create any number of input parameters you need.

In this example, I am using the DataVerse connector to fetch account details by Id. For Id, I am using the SearchText input parameter.

The final step is to return value from Power Pages using the below connector.

As you can see from the above screenshot, I have mapped three parameters ‘AccountName’, ‘AccountNumber’ and Email which are mapped to respective fields of the account record.

Provide an appropriate name for flow and save it. Once the flow is saved, you will be get an option to add the flow to Power Pages. And this is where it gets interesting. Now you also have an option to add web roles to the flow.

This is a very important step. And much desired too. What this ensure is users in specific web roles only can invoke the Power automate flow from portal.

Don’t forget to copy the URL. We will need it in the next step to invoke this flow.

Next I navigate to Power pages studio and create a New page.

And open VS Code to edit the page html.

Below is the code to invoke the flow from the Page.

 <script type="text/javascript">
    
    $(document).ready(function(){
    var cloudFlowUrl = "<Power Automate URL copied from previous step>";

    // set the input parameters
    var requestData = {};
    requestData.SearchText = "76120070-04d2-ee11-9079-000d3a3b9b0d";

    // set the event data
    var requestPayload = {};
    requestPayload.eventData = JSON.stringify(requestData);
    
    shell.ajaxSafePost({
                    type: "POST",
                    contentType: "application/json",
                    url: cloudFlowUrl,
                    data: JSON.stringify(requestPayload),
                    processData: false,
                    global: false,
                })
                .done(function (response) {
                  debugger;  
                  const result = JSON.parse(response);
                  alert(`Account Name: ${result.accountname}, Account Number: ${result.accountnumber}, Email: ${result.email}`);

                })
                .fail(function (error) {
                  debugger;
                    alert("failed");
                });
              });
        
  </script>

Ensure to invoke the code when the page is loaded. I have used $(document).ready to ensure the code is executed when the document has loaded completely. Otherwise you will get an error – ‘shell is not defined’

And that’s all. If you are logged in with the appropriate web role which is assigned to execute the Power Automate flow, you will get the results from the flow.

Hope this helped. You will also like the below posts.

Debajit Dutta