In this post you will see a step by step guide on how you can integrate the Power automate with Power Apps portal or with any other web application.The good thing is that you don’t have to refresh the page or you don’t have to submit any form.
You can also use any connector that is available in power automate. This way you can use any data source for Create, Read, Update, Delete. Power automate is a very handy tool for you to connect with external services. Like You can use the power automate with Shopify web hooks and Zoho web hooks even with the actions of Dynamics 365 CRM. 

Note

Power Automate is the new official name for Microsoft Flow.

So let’s say you want to fetch some customer records from dynamics 365. What you need to do is just follow the below steps.

 

  1.  Create a Web Template in Power Apps Portal.
  2.  Then assign it to a page template.
  3. Then assign that page template to Web Page.
  4. Now the portal page is ready.
  5. Now Setup the flow.
  6. Use a trigger called “When a http request is recieved”.

  7. Now Configure the this trigger like the picture show below or it depends on your request.
  8. Now add an action of Dynamics called “List Records”
  9. Now the last action of flow is to return the response that you’ve received from Dynamics action.
  10. Use the “Response” Action of flow.
  11. Now copy the url from the http trigger that we have created in start of this flow. Because that’s the url we are going to use in portal page.
  12. Use this below “Javascript” to send the request to flow.
   $(document).ready(function() {
        var settings = {
            "async": true,
            "crossDomain": true,
            "url": "paste the url that you've copied from the flow.",
            " method": "GET"
        }
        $.ajax(settings).done(function(response) {
            console.log(response);
            var list_users = '';
            if (response.results.length > 0) {
                $.each(response.results, function(index, item) {
                    list_users = list_users + '<div>' +
                        '<div>' +
                        '    <img src="https://your-url/images/123.png' + item.member_id + '.jpg">' +
                        '</div>' +
                        '<div>' +
                        '<h1>' + item.full_name + '</h1>' +
                        '<span member-id=" ' + item.member_id + '">ID:' + item.member_id + '</span>' +
                        '<p>' + item.company + '</p>' +
                        '<p>' + $.trim(item.location) + '</p>' +
                        '</div>' +
                        '<div></div>' +
                        '</div>';
                });
			}
		});
	});

Reponse:

You’ll get the response like shown in below picture. But obviously yo can design your html according to your needs.

This is the “GET” request example you can create “POST” example same way you just need to change the request type in Power automate flow and within your Javascript code.

 

Comments