3 ways to create custom connectors

[Music] [Music] hey guys welcome today's topic is creating custom connectors in power platform we will look at three ways to create your custom connectors the first one would be to build it from scratch second one is using postman collection and the third one is to use open api file so let's get started the reason you need custom connector is to provide additional data or perform any actions that cannot be performed using out of the box connectors you can think of it as a wrapper to your existing web api for communicating with canvas apps in power platform first thing you need is an existing web api and that wave api can be deployed wherever you want mine is currently hosted in azure so this is my web api uh it's a superhero web api which has a post message and it takes a request and the request looks at the it either takes in the id or the name and then based on whatever is supplied it would look for the superhero based on the name and then give a response back with some statistics so these are this is a response back from my web api which would have the name the power stats url and some stats around um around the superhero right so that's what my web api does now if we go to azure and this is my azure um hosted api so it's api app it's hosted on this particular url so let's go and test our web api first so to test it i'm going to use postman so if i go to postman i can see that my url is here i have not given any parameters my authorization is currently it's open ended there's no authorization needed and then in the body i'm providing the name as superman and i'm gonna send it and let's look at the body and that's the result that i get so i'm getting the id name url intelligence and strength and some other power states and that and this proves that my api is working okay so now let's go and configure this api in our our platform so to do that first you will be on your home page you have to make sure that you are in the right environment once you have determined that you're in the right environment you can go to custom connectors over here under data so if you expand data you can go to custom connectors and inside custom connectors you can click on new connector and you can start from scratch using discrete from blank so once you do this custom connector from blank you would be asked for a name so i'm gonna do super hero from from scratch okay so now once you have clicked given the name and clicked okay you will be taken to this connector configuration screen where you have four steps so first is your general information like you can provide a background color so you can give like zero zero seven e 4 5 that's your color and then after that you can provide an icon whatever you want and then you can provide the description over here and now so i can just provide my host name so i can go to azure i can copy this url and provide it in the host name but now i have to remove https because i'm already providing the scheme scheme here whether it is https or whether it is http so i'm going to remove this and we just need to use the domain that's it if you have like forward slash api of our slash whatever the route is you don't have to provide the routes here you just have to provide the host okay uh and then here you can provide the base url if your if all of your apis is going to have uh let's say xyz.com forward slash api then you can provide that api over here which means all your requests would have that api is post fixed to your host okay so once you have defined your general information we need to go to second step which is the security step so in the security step you can configure your base basic authentication or if you are providing this information through a api key or if you're using oauth uh for demo purposes i have kept it simple and i'm only using no authentication so i'm going to choose no authentication and then i need to go to the definition now because we are creating this from scratch we have to define all the actions all the references all the policies that our api is using and to do that first you have to click this new action button over here and then in the summary you can provide um a summary of what your action is gonna do and action is nothing but your uh it's your method right so in my case it's gonna be um getting the info superheroes information so i'm gonna say get super hero info and in the description i can write a lendy description where it would specify what kind of information is expected from this particular action so retrieves retrieves all these super hero power stats with url okay and then the operation id has to be a unique string without any uh space in them or any special characters so this is kind of your method name so my method name is gonna be get super hero info that's gonna be my operation id now in the visibility you can uh provide the visibility as advanced internal or important now if you specify internal then it's gonna be hidden uh when the users are gonna use your uh custom connectors uh if it's gonna be if it if you mark it as important then when you are using this in the um power automatic flow then you can see this as listed as the important of the first method is gonna be shown would be get superhero info advance is it's not available in the first few uh list of methods but then you have to expand or click on more and then you would get this particular method and none is where the system would define how to show it right i would keep it as none because my custom connector is only gonna use one single uh action so it would always show up whenever i'm trying to use it i'm gonna keep it as none now we have to define our requests and responses so in the request we have we have an option to import it from a sample so let's go and click on import from sample now here is where you have to first provide what kind of request it is is it a get request post put what it is right and all this information is you can easily get it if you're using postman so in the postman you i'm using post so i go here and i'll select post then i'm going to select my url so i can just go to my postman copy it and then paste it over here then i can keep the headers as is because in the headers the content type uh it would automatically detect the content type but if i have any special headers like if i'm using uh x uh i'm passing in the passwords in the headers or something like that or base encoded passwords then i can certainly go into the pass headers and then just copy the header name and the header value and then i can provide those over here okay in my case i don't have to provide any headers because i'm not using any special headers but i'm using body so i'm going to copy the body and this is a sample body it doesn't have to be like a generic body you just have or it doesn't have to be the um the type object type but you just have to provide a sample body i mean it would automatically detect your request types and what it is expecting so once you do import it's gonna show you okay so it's gonna show me the url over here and then it's gonna show me the body over here if you had any headers it would show you the headers over here as well now if you go inside the body you click on edit you can see that it automatically detected that inside the body you have a name as a parameter or one of the attribute of json and whether it is required or not you can select it over here and in my case it's going to be yes um and yeah so that's that's my configuration for my request now let's configure the response body so now here it it's where it gets little tricky because the default response is already added but you have to configure your response and how in the way we did it in request we just imported from sample but there could be several responses there could be a 200 response there could be 503 response or 500 or 400 responses so response codes could vary so when you click on say add default response um sorry so when you click on this default you actually are taken to the configuration page of that particular default response and again same thing in the default response you can just take the response from your from your postman and [Music] say input from sample and you can provide your headers here again similar to what we did for request and provide your body here and then say import now once you do import you can see that body has compact and durability id and all other stuff now by default it would take whatever name is in the json but then if let's say you want to change the name like if i want if i don't want to use url here i want to change this url to something else then i can go in and edit it and then say okay i want to call this as image url instead of just url and i'm gonna put in the same description here uh and then that's it right so now whenever i'm whenever my users would be trying to use this connectors they would see image url instead of the url which is the expected um attribute on the json file so so this particular definition is mapping your friendly names with your required names okay so we have defined our request we have defined our response so now let's go and test it but before we test it it's going to tell us that we have to create the connector so we'll create the connector first and there you go so now you can see that it was created and then and now it shows you the test screen but to test the screen you first need to create a connection and because it's a new connector you won't have a connection so let's go and create a new connection but once you do this you would be taken to the connection screen instead of the app instead of the application just staying on the screen so if i click on create once the connection is ready it would take me to this connection screen and you can see that the superhero from scratch connection is present over here okay which was created one second ago but then we have to go back to custom connectors because we want to test our connector right so superhero from scratch i'm going to go and edit it and i'll directly go to the test screen and it automatically detects the connection because there's only one connection if you had multiple connections you can actually select it from this list and then in the operations as you can see the request had one single attribute so it's asking for that attribute as name and then i'm going to supply as batman and say test operation and then this is my response which is 200 and then it gives me the body and that's how you create a custom connector from scratch pretty straightforward right let's look at the second way of creating custom connectors and that is using postman once you click on new custom connector you have several options and one of the option is to use postman collection if you click on import a postman collection option you would see that the application is asking you for a connector name and a personal collection file and it's asking you for specific postman collection version one file so let's go to the postman and then see where how we can create this collection file so postman has several options and one of the option or feature is creating a collection and collection is nothing but group of all apis in one single folder right so you can think of collections as a folder and you can create a collection by clicking on new collection option here and when you click on new collection you will be given an option to provide your name you can also provide your description and this description can be provided in a markdown file if you want let me provide your authorization in my case it's no auth but you can certainly pick from multiple options that are available in the postman you can configure your tests and you can this is the important feature that i would like to highlight is you can use variables and you can give your variable name you can provide an initial value and then once you have created your collection you just click on create button now let's see how do we add an api into the collection it's pretty easy you click on a new tab you provide the url you provide the method if it's post get whatever it is you provide the authorization parameters headers body and everything else in my case i'm going to provide the body okay and then you can do send which gives you the response this particular tab can be saved in a specific collection so to do that you have to go on this save and here you can click on save and you can provide your request name so super hero demo provide your description and then here is where you would select your collection and i've selected superhero api custom connector which is one of my collection which is specified here and then i can just add it to that to that collection okay i'm not going to do that because i've already created a collection and i've already added my request to that collection so i don't want to create duplicates so just let's go and look at that specific collection in this collection superhero api custom connector i have this api called a superhero info which is exactly this one and if you click on this three dots where you see more actions you'll get an option to export this particular collection and when you click on export you will see that collection version 1 is deprecated and there's a new collection version called as 2.1 but the powerapp only needs collection version one it doesn't work with version two or version 2.1 so even if it is deprecated uh right now powerapps is only accepting collection version one so you click on export and then it would provide you with a file now let's go to power platform let's provide the connector name so superhero postman now let's use the exported file and then let this is the exported file that i had from postman collection so i'm going to select this file and then say open and continue what the application would do is it would read the postman collection it would read the description it would read the host names and all the definitions that are available in the collection would show show up here so the description is the name of the collection your host name is this one and then in your security you would have no authentication and in your definition you would have super hero info which is the name of the api that you gave when you saved your api in a collection and you can certainly change this information so you can certainly change the operation id uh your descriptions your summary the cool thing is it automatically recognized what your url is and what your body is going to look like so if you go into the body you would see that body is marked as required and it also has name which is what we supplied in our api request on postman right and also we don't have to provide uh the response the response is automatically configured for you but here's a caveat the response is in the form of the json output and if you keep it the way it is right now then you would get a string of instead of getting a json response where we had id url and all other power stats of the superhero instead of having those separated out you would get one single string so you don't want that to happen right so we have to fix this so we and to fix it is instead of using the default response from postman i would recommend you to import it from a sample so from a postman you just copy the response and do an import of the sample and that would provide you with the with all the attributes from the json as a body parameter or a body body payload and that's how you would create your connector using postman i can create and as we did it with all with the previous one we would again go and test this connector and create a new connection same process as we did earlier and go and test it so by the name is batman and let's test the operation and here we get status 200 and then we get the body whatever we want right so that's how we create the custom connector using postman the last option that we're going to look today is creating the custom connector using open api file now to use open api file your api should provide with the open api file definition and if your api is hosted in azure then azure provides an easy mechanism to provide that kind of files so let's go to azure and see how we can do that so here i have my api and my url and it's running right but in the api configurations in the left blade you would see an option called this api management so if under api section you would see api management now api management is what gives you the ability to manage secure and publish your apis in different formats so let's go and create a new api management so i'm going to provide my api management name i'm going to select my subscription my research group locations and my organization name my administration email my pricing tier and then if i want to enable application size and i can select application insights now if you have selected a consumption tier it may take a while for the api management to get created and get linked to your api so you would see that message that if there's a consumption tier then it would take about half an hour oh sorry for consumption tears it's going to take few minutes but for any other it's going to take up to a half an hour for this to get created so now once your api management is created you would see this message where it says your app is now linked to the api management instance and it would provide the instance name now and you can go to the api management by using this button so let's go to the api management service and in the api management service you can go to api and inside this api you would see that there are new apis and you are on the ad api screen now if the api was already linked and added you would have seen the api name here but as we are not able to see our api here we are just going to go and add it now the api is hosted on an on app service so i'm going to select this api option so i'm going to select my app service and then here is where i can select my app i'm going to do browse and i'm going to select my app which is my maverick superheroes select it would show me the display name my name and the api url suffix if i want any and i'm going to create now this added the api under my api management service and as you can see it added a default set of operations you can customize all these operations to your needs in my case my the only operation that my api is going to provide is the post message so i don't i don't need any other operations i'm just going to go and delete all the operations that are available here and that's it now i only have one operation called post and i have to configure this operation in a way that my open api file is correctly configured so my root domain has superhero in its root right so i'm gonna go and fix that first i'm gonna do slash super hero okay and this is my front end and then i'm gonna configure my header so if my api is always gonna ask for certain headers in my case i'm gonna do content type and my content type is always going to be application json right and then i can configure my requests here so i'm going to do request and then how my request is going to look like now when i'm adding a presentation i type in application and json it's it's going to be my application json is going to be my definition for my request and i can provide the sample here so i'm going to go to my postman again to capture my request and provide the sample here but if i provide a sample here i am only providing the sample on one single operation if you want to use your sample and if the sample is used across several different api operations then you might want to create a definition so this this is where i would create my definition so i can say create new definition say superhero response i'll provide my sample.json and it creates a payload based on my sample json and i say create definition and i just provide my definition over here yeah then i need to also specify my response so add a response and what type of response am i expecting from this particular operation and i'm expecting 200 okay response so select 200 okay response i have to give the name so i'm going to do response or just a response and then here same thing again i have to provide a representation of my response right so here i'm gonna type application json and i'm gonna provide my definition again i go back to my postman select the response copy it and then back here i create a new definition oh i created a wrong definition in the request actually provided response ah okay i'm gonna fix it okay so i'm gonna save this for for now and i'm gonna go to definitions and definitions you can go from here and then you can rename this to request let's save it so now it's request so let's go back to operations and inside the operations you you can go to your post operation in the request now the definition is request right coming back to response let's configure our 200 ok response because we left it midterm right and then let's let's just complete that definition so on 200 okay we provided content type is application json and now we provide the new definition for the response yeah and then it creates a payload for us and then we say create definition so now we have created two definition one for request called as sh request and then one for response called as sh response i'm not gonna provide any headers on my response okay then i'm gonna save it now my front end tells me that i have my post operation as my domain forward slash superhero i have i have to provide a content type my response is going to be 200 and then i have two definitions one for request one for response if you have any kind of policies then you can add inbound policies or outbound policies and you can add few other stuff in the back end if you want now in the settings you define your url scheme you also define whether the subscription is required or not and then you also provide your user authorization and then you can test it from here itself so in if you go to test you would see that the host name is auto populated the headers is auto populated and then the request body is a sample request part is provided to you then you just have to hit send and then it would provide you with the response and there you go http response is message 200 okay and then it provided you with the response now once you have tested your http requests and response and you are comfortable with all your operations and are ready with the api file the way you create a file is click on this three dots and then say export and when once you click on export you will be provided with several options one of the option is to directly integrate the powerapps are the configuration to a custom connector and you can directly create a custom connector from here itself but let's say your domain your azure tenant and your powerapps tenant are not same which is the case in my scenario as well so my azure directory is not linked to my power platform tenant and was both are in different tenants so for that i'm going to export version 2. do not use version 3 because power apps power platform is not accepting version 3 file so export a version 2 file of open api okay and that would be a json file as well so now once you have downloaded the file let's head back to our custom connector screen and then click on new custom connector and then open api file and now you provide the name of the connector so super hero open api and now you import the open api file that you just downloaded and say continue and like we did for postman connectors and for the connectors from scratch we can provide the icon color descriptions and whatnot um and this gets auto populated based on the open api file so we don't have to provide any more details so let's go to security and the security if you have checked the subscription key then it this would auto populate but we don't want it so we can always change this while configuring the connector so we are going to select no authentication and then it takes in the summary the descriptions whatever was provided in the on the api management configuration but then it just takes a deep good but the cool thing is as we had provided definitions uh it also provided the body so if you go into the body it provided us with the name is required is marked as no but we can mark it as yes and then the body has name on it if you go to response response is 200 and then there's a content type so we have to provide the content type here as application json of type string and then the body automatically showed you the payload the required payload so it so uh in when we were using postman collection it was not able to pass that body payload out but then when you are using api management open api file definition it is able to pass out the body payload okay so we go back and then let's change this operation because this is not what we want super hero get superhero info okay and let's see all the validation succeeded and the white still showing me the warning sign but let's go and do a create okay and similar to all the other operations that we did we have to test this out and for testing it we need to create a new connection open api and then we go to the test operation provide the content which is going to be application json provide the name as batman and test the operation oh we got the error access denied due to missing subscription key ah yes so let's go back to the api definition settings and the subscription key was made as required so we have to make sure that the subscription is uh depending on how you're configuring your api uh if your api is not requiring a subscription you disable this save it so going back let's do the test operation again and there you go now you get 200 success response and then this is the response say close and that's it thank you for watching don't forget to follow me on social media if you like the video hit the like button and subscribe to my channel if you have any suggestion then leave a comment below [Applause] [Laughter] you

Channel: Power Maverick

Views: 2,073

Keywords: Dynamics365, powerapps, powerplatform, msdyn365, poweraddicts

Id: hFwEAv_2554

Length: 38min 28sec (2308 seconds)

Published: Mon Sep 21 2020