cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
Highlighted
Frequent Visitor

Unable to use Web api call in canvas app

Hi All,


I am trying to use web API(link below) call, but the below link says it is only available for Model driven apps.

https://docs.microsoft.com/en-us/powerapps/developer/component-framework/reference/webapi

Any alternate way to use API call in Canvas App? Any suggestion much appreciated.

5 REPLIES 5
Highlighted
Solution Sage
Solution Sage

You will need to create standard XMLHttpRequests. This is a sample I posted earlier today (it calls an action within a Model driven app) you will just need to change the baseUrl, query and body contents.

 

var req = new XMLHttpRequest();
		var baseUrl=this.baseUrl;
var query="/api/data/v9.1/hdn_ValidateLicense";
		return new Promise(function (resolve, reject) {

			req.open("POST", baseUrl + query, true);
			req.onreadystatechange = function () {
				
				if (req.readyState !== 4) return;
				if (req.status >= 200 && req.status < 300) {
					
					// If successful
					try {
						
						var result = JSON.parse(req.responseText);
						if (parseInt(result.StatusCode) < 0) {
							reject({
								status: result.StatusCode,
								statusText: result.StatusMessage
							});
						}
						resolve(req.responseText);
					}
					catch (error) {
						throw error;
					}

				} else {
					// If failed
					reject({
						status: req.status,
						statusText: req.statusText
					});
				}

			};
			req.setRequestHeader("OData-MaxVersion", "4.0");
			req.setRequestHeader("OData-Version", "4.0");
			req.setRequestHeader("Accept", "application/json");
			req.setRequestHeader("Content-Type", "application/json; charset=utf-8");
var body=	"{'ProductName': '"+productName+"'}";
			req.send(body);
		});

 

---
If this post has answered your question please consider it for "Accept as Solution" or if it has been helpful give it a "Thumbs Up".
Highlighted

I really hope that we will get the Xrm.WebApi implemented in Canvas Apps at some point - but it does kind of go against the principle of Canvas Apps - using connections to communicate with CDS.

@ben-thompson this has got me thinking - would this code work in Canvas - wouldn't the user need to be already authenticated with CDS first so that there is a bearer cookie? If you are running on the mobile app I'm not even sure that the bearer cookie would be available? You'd need to do an auth request to get the access token first. And then there is CORS? - https://docs.microsoft.com/en-us/powerapps/developer/common-data-service/oauth-cross-origin-resource...

Highlighted

Just gave it a go and managed to call with auth using adal:

 

config = {tenant: "mytennant.onmicrosoft.com",clientId :"51f81489-12ee-4a9e-aaae-a2591f45987d"}
adalContext = new AuthenticationContext(config);
adalContext.acquireToken("https://org.crm11.dynamics.com",
(e, accesstoken) => fetch("https://org.crm11.dynamics.com/api/data/v9.1/accounts",
{headers:{"Authorization":"Bearer " + accesstoken}}).then(
  response=>response.text().then(b=>console.log(b))
));

 

 

Highlighted

I wrestled with this same issue in a separate thread ( pcf assign output params for canvas app operations ) . Rather than using adal, I decided to push the database operations back up to PowerApps. I could say I did it because I wasn't certain the token would be available without MFA, but really... it's just because I'm lazy.

 

Within your Canvas app, what you need to do is define one or more Output type params, then give it the data you need to undertake your action (e.g. for an update, the GUID and attributes to update) then you call notifyOutputChanged to let the canvas app know your output is ready.  Back up in your Canvas App, you just put your logic into the OnChange event on the control (which is essentially what you are calling with notifyOutputChanged). Then, your outputs should be available in <controlname>.<outputparamname> so you can do your CDS operations from up here or even in Flow.

 

Quick note though: a big drawback you're going to run into with this approach is the known bug @HemantG and team are working on where a canvas app caches its embedded pcf and doesn't refresh the control when you update pcf in solution. Because you will be splitting your logic across the pcf and the canvas app, you will likely need to iterate a few times and will need to delete the canvas app and recreate it every time you make a change in pcf. Definitely a big headache, but they are working on a fix and I'm sure it will be available soon.

Highlighted

For now best solution is to use the output and let canvas app store the data. I have used patch in one of my recent exploration to save data to CDS. PCF upgrade issue should be fixed now and you should see PCF update prompt when the app is reopened. We will have more tighter inner loop in future releases for canvas apps. 

 

hemant

Helpful resources

Announcements
Community Conference

Power Platform Community Conference

Check out the on demand sessions that are available now!

News & Announcements

Community Blog

Stay up tp date on the latest blogs and activities in the community News & Announcements.

secondImage

Power Platform 2020 release wave 2 plan

Features releasing from October 2020 through March 2021

Community Highlights

Community Highlights

Check out the Power Platform Community Highlights

Users online (10,096)