Episode #8 - Consuming 3rd party APIs from SharePoint Framework

welcome back to business tech bytes today I want to talk with you about a fresh new capability introduced under preview in the SharePoint framework version one point four point one it is the capability that allows you to consume the micrograph as well as an inter-party api's within SharePoint framework lines that were part or extensions it uses is ready for the authentication and authorization especially using the open authorization protocol provided bias of the by is ready it can be used to create real business level solutions which can rely on external services in order to improve the functionality and capabilities of the SharePoint remote solution that will be on them so let me move to the department and let me show you how to play with this new capability so here we have a custom API built using asp.net MVC and as you can see we have an API controller which is subject to authorization and in which we have an action which is called business action the business action will receive a text to hey code just for the sake of making an example and we'll give back a response made of the text to echo the date and time of the request and if there is a current principle the identity name of the current principle in the user name property of the response this API is provided from a security and from an authorization perspective using the Windows Azure Active Directory bearer authentication which is based on the audience of the app which is the unique URI of the application is your Active Directory in fact if I go to Asia Active Directory you can see here we have in the azure ad under the cover of my office trees fight tenant I have an application called SharePoint dot BMP dot sample REST API which in the settings as a property of app ID URI which is exactly the audience we have in the web config moreover in the manifest file of this already application I have an open authorization to permission which is called the business action that invoke and which will be the permission needed to call to invoke this operation this rest api in a secure way that's why from a sharepoint frame or perspective in the package.json package solution json file i have a web api permission request which is targeting the japan PMP sample REST API application that I've image already and is requesting the scope business action dot involve which is the one I configured in the manifest moreover in the tsx file of my react component under the cover of the kinds of a paradigm building and which will consume from the REST API I have the ad HTTP client object which is created I have a new instance of this object targeting the unique URI of my application and then I can simply make a request an HTTP request which will be with the body content of tight application JSON and in the body there will be the text to echo that I want to send to my target API then I can just make a post request targeting the URL of my REST API which is posted right now in this sample under Asia in an inner up service and I can provide the request options which will include the custom headers and the JSON body of the request and I will get back a JSON response which will be made of the username the request date and the echo so that from a user perspective and user perspective if I go to the workbench here I have my client-side web part I can provide a text to echo for demo purposes and I can invoke the API and as you can see I have the Adi LGS window to get the access token and I get back my echo text as well as the current user name so that you can see that the request uses a delegated token from an open authorization perspective and I get back the date and time of my request if I press at 12:00 and if I go into the application folder I have the token oops not taken but token of my god from is ready and which is the open authorization token to consume my API in a safe and secure way so this is really interesting and useful and in order to make it fully functional from a up service perspective where I am hosting the recipe I have to configure in the course settings of the application that I want to make it possible to have cross-origin resource sharing for the SharePoint Online tenant that will consume my API and last but not least from an admin perspective from a sharepoint online admin perspective in the api management page of the new at mini of sharepoint online i have to provide to constant and approve the permission to access the scope business action dot invoke for my target API so using this technique you can create client-side web parties in SharePoint framework you can consume third-party api's whether you built them using asp.net MVC or whatever else technology or whether you are using a third party API is built by someone else but overall you will be able to consume external REST API in a secure and safe way leveraging the edge already and the open authorization protocol to authorize access to the actions and to the resources you want to consume through rest this is really powerful and make it possible to create real business solutions with SharePoint framework I hope you enjoy this video thank you for watching and see you next week

Channel: PiaSys Tech Bites

Views: 577

Rating: 5 out of 5

Keywords: SharePoint Framework, REST API, 3rd Party API, Azure AD, OAuth 2.0

Id: HEV-CP0LBF0

Length: 5min 59sec (359 seconds)

Published: Tue Feb 20 2018