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
Impactful Individual
Impactful Individual

Re: Unable to use Web api call in canvas app

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

Re: Unable to use Web api call in canvas app

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

Re: Unable to use Web api call in canvas app

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
Resolver I
Resolver I

Re: Unable to use Web api call in canvas app

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
Power Apps
Power Apps

Re: Unable to use Web api call in canvas app

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
secondImage

Demo-Extravaganza 2020

Check out these cool Power Apps & vote on your favorite!

secondImage

Community Highlights

Check out whats happening in Power Apps

secondImage

Community User Group Member Badges

FIll out a quick form to claim your community user group member badge today!

secondImage

Power Platform 2020 release wave 2 plan

Features releasing from October 2020 through March 2021

Users online (7,797)