How To Fetch Access token using Microsoft Graph API

Microsoft Graph API 

Microsoft Graph API allows the data to interact with millions of users in the cloud. Using Microsoft Graph API, you are able to create applications for your organization with single Graph API endpoints.

Endpoint URL :http://graph.microsoft.com

Use of Microsoft Graph API

  • Create, manage, and view Office 365 calendar events and also find your meeting times.
  •  Access information for the relevant people from Office 365 users.

Getting Started with Graph API

  • Register your application from Microsoft apps registration portal
  • Authenticate the user to fetch the access token through OAuth Protocol
  • Consume the data using Microsoft Graph API
  • Run the application.

Let’s discuss how to fetch the access token based on the user.  

Navigate to the app registration portal  https://apps.dev.microsoft.com   

Log in to your tenant account.

Microsoft Graph API

 Click “Add an app” button to register your app. 

Provide the Application Name and click Create.

Microsoft Graph API

After successful creation of the app, it shows what kind of application is going to consume the data from Microsoft Graph API.

Microsoft Graph API

Copy the unique Application Id later used in an API to fetch access token. 

Generate the application secrets to authenticate the app.

Microsoft Graph API
Microsoft Graph API



n a Platform for web-based applications, use “WEB Platform” for Web API;  you can choose “WEB API Platform” and for mobile based applications use “Native Platform”.

 Now, I have chosen “Web platform” to play with SharePoint.  Provide the redirect URL for the application.

Microsoft Graph API

Provide the redirect URL  of your web application  The “Allow implicit flow” allows the option to enable the Open Id to connect hybrid and implicit flows.

The hybrid flow enables the user to receive sign-in info for obtaining the access token.  Click “Save” to complete the App registration.

Microsoft Graph API

 Fetch Access Token

Host : https://login.microsoftonline.com    
POST: /{tenant}/common/oauth2/v2.0/token     
Content Type:  application/x-www-form-urlencoded     
Client ID:   *****************     
Client Secret: ********************     
grant_type: client_credentials 

Tenant: The directory you want to request permission from (for ex; contoso.onmicrosoft.com). 

Client ID: The unique Id generated from the app registration portal 

Client Secret: The password generated from the app registration portal. 

Scope: http://graph.microsoft.com/.default. This applies all the application permissions to the app. grant_type: It will be client_credentials

Code

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
  
<script type="text/javascript">  
    $(document).ready(function() {  
        requestToken();  
    });  
  
    var token;  
  
    function requestToken() {  
  
        $.ajax({  
            "async": true,  
            "crossDomain": true,  
            "url": "https://cors-anywhere.herokuapp.com/https://login.microsoftonline.com/sharepointtechie.onmicrosoft.com/oauth2/v2.0/token", // Pass your tenant name instead of sharepointtechie    
            "method": "POST",  
            "headers": {  
                "content-type": "application/x-www-form-urlencoded"  
            },  
            "data": {  
                "grant_type": "client_credentials",  
                "client_id ": "8baf0301-27df-44b1-b4fe-7911b9a918de", //Provide your app id    
                "client_secret": "**********", //Provide your client secret genereated from your app
                "scope ": "https://graph.microsoft.com/.default"  
            },  
            success: function(response) {  
                console.log(response);  
                token = response.access_token;
                document.getElementById('content').innerHTML = token;
            }  
  
        })  
    }  
</script>  
<p id="content"></p>

Open SharePoint site -> Add a content editor webpart -> link the HTML file; it contains the above script  -> Click OK. 

Here is the result in the console window. Now, we have successfully fetched the access token.

Microsoft Graph API

  In my next article, let’s see how to fetch users, groups, calendar events and a lot more stuff using Microsoft Graph API. 

Download Here:- https://sharepointtechie-my.sharepoint.com/:f:/g/personal/vinodhvignesh_sharepointtechie_onmicrosoft_com/Ep7ojfqEBmhGjWjHFMXmvU8BZqipYOqxkfvt63h4HFvohQ?e=0hhuWn

Happy SharePointing!

Author Profile

Vinodh
Vinodh is a Microsoft MVP for SharePoint (Office Apps and Services) having 5+ years of experience in Microsoft Technologies.

His interest and expertise includes SharePoint Online Development, PowerApps Development, Flows for SharePoint and PowerApps. Single Page Apps/Add ins for SharePoint using React, Angular. SharePoint Farm Management, 2, 3 and upto 6 tier SharePoint Farm Installation and Configuration.

Awards :
Microsoft Most Valuable Professional for SharePoint and Office 365 awarded for the year 2016, 2017 and 2018.
C# Corner Most Valuable Professional for SharePoint and Office 365 awarded for the year 2016, 2017 and 2018.
Technology Expertise :
SharePoint Online, SharePoint 2013, SharePoint 2016 and SharePoint 2019 Preview.
Intranets both Modern and Classic, SharePoint Frameworks Customisation, SharePoint Add-ins, SharePoint single page apps.
Angular 5 with Bootstrap single page apps.
Typescript, JQuery and Javascript.
Micrsoft Flow and Powerapps.
Utilised :
Microsoft Graph API, SharePoint REST, SharePoint PnP JS.
Out of Box :
Consume Content search web parts for internet publishing sites using custom display templates.
Having knowledge on SharePoint workflows and SharePoint Designer workflows.
List customisation using JS Link, JSON Formatting.
Having knowledge in Active directory management services.
Create and configure service applications in SharePoint (MMS, UPSA, SSA).
Configure Outgoing email settings using SMTP Services.

Add a Comment

Your email address will not be published. Required fields are marked *