Retrieve Mailbox Folders Using Microsoft Graph API

In this article, I have explained how to retrieve all the mailbox folders from your Office 365 account using Microsoft Graph API end-point.

In my previous articles, I have written about fetching access token and users/groups. I have added the links of these previous articles below for your reference. Please go through these before following the below steps.

Retrieve Mail Folders

  • EndPoint - https://graph.microsoft.com/v1.0/me/mailFolders
  • Usage - It retrieves all your folders from your mailbox

I have tested it in the Graph Explorer. It returns the JSON data like below.

Retrieve Mailbox Folders Using Microsoft Graph API 

So, let us see how to retrieve it programmatically using JavaScript.

Please follow my previous article How to fetch access token to authenticate your web application to fetch the access token and authenticate.

Step 1 - Fetch Access Token

AuthUrl: https://login.microsoftonline.com/{{tenant}}/oauth2/v2.0/token

Type: POST

  1. var token; // Initialize Globally  
  2. functionrequestToken() {  
  3.     $.ajax({  
  4.         "async"true,  
  5.         "crossDomain"true,  
  6.         "url""https://howling-crypt-47129.herokuapp.com/https://login.microsoftonline.com/sharepointtechie.onmicrosoft.com/oauth2/v2.0/token", // Pass your tenant name instead of sharepointtechie  
  7.         "method""POST",  
  8.         "headers": {  
  9.             "content-type""application/x-www-form-urlencoded"  
  10.         },  
  11.         "data": {  
  12.             "grant_type""client_credentials",  
  13.             "client_id ""8baf0301-27df-44b1-b4fe-7911b9a918de"//Provide your app id  
  14.             "client_secret""tZ76oVPN039WlWPoAp+1aICq66vs7oUtE4lhDQYwxGY="//Provide your secret  
  15.             "scope ""https://graph.microsoft.com/.default"  
  16.         },  
  17.         success: function(response) {  
  18.             log(response);  
  19.             token = response.access_token; //Store the token into global variable  
  20.         },  
  21.         error: function(error) {  
  22.             log(JSON.stringify(error));  
  23.         }  
  24.     })  
  25. }  

The successfull response is shown below.

Retrieve Mailbox Folders Using Microsoft Graph API 

So now, let us create a function "RetrieveEmailFolder" and pass the access token into the header.

EndPoint

https://graph.microsoft.com/v1.0/me/mailFolders
https://graph.microsoft.com/v1.0/users/{{userid}}/mailFolders

Method

GET

Code

  1. functionRetrieveEmailFolder() {  
  2.     $.ajax({  
  3.         method: 'GET',  
  4.         url: "https://graph.microsoft.com/v1.0/users/vinodhvignesh@sharepointtechie.onmicrosoft.com/mailFolders",  
  5.         headers: {  
  6.             'Authorization''Bearer ' + token,  
  7.             'Content-Type''application/json'  
  8.         },  
  9.     }).success(function(response) {  
  10.         vardata = response.value;  
  11.         log(data);  
  12.     }).error(function(error) {});  
  13. }  

We have got the "HTTP 200 success" message. It returns the JSON data.

Retrieve Mailbox Folders Using Microsoft Graph API 

Now, I am going to pass the SELECT query to retrieve a particular column from the OData. For example, ?select=displayName. You can add multiple column names in the SELECT query instead of fetching all the properties.

The code for passing the ?select=displayName is shown below. It retrieves only the selected property.

Retrieve Mailbox Folders Using Microsoft Graph API 

Code

  1. functionRetrieveEmailFolder() {  
  2.     $.ajax({  
  3.         method: 'GET',  
  4.         url: "https://graph.microsoft.com/v1.0/users/vinodhvignesh@sharepointtechie.onmicrosoft.com/mailFolders?select=displayName",  
  5.         headers: {  
  6.             'Authorization''Bearer ' + token,  
  7.             'Content-Type''application/json'  
  8.         },  
  9.     }).success(function(response) {  
  10.         vardata = response.value;  
  11.         log(data);  
  12.     }).error(function(error) {});  
  13. }  

Then, let us apply .map to iterate over the response and display it on the page.

Full Code

  1. < script src = "https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js" > < /script> < script type = "text/javascript" > vartoken;  
  2. $(document).ready(function() {  
  3.     requestToken();  
  4. });  
  5. functionrequestToken() {  
  6.     $.ajax({  
  7.         "async"true,  
  8.         "crossDomain"true,  
  9.         "url""https://howling-crypt-47129.herokuapp.com/https://login.microsoftonline.com/sharepointtechie.onmicrosoft.com/oauth2/v2.0/token", // Pass your tenant name instead of sharepointtechie  
  10.         "method""POST",  
  11.         "headers": {  
  12.             "content-type""application/x-www-form-urlencoded"  
  13.         },  
  14.         "data": {  
  15.             "grant_type""client_credentials",  
  16.             "client_id ""8baf0301-27df-44b1-b4fe-7911b9a918de"//Provide your app id  
  17.             "client_secret""tZ76oVPN039WlWPoAp+1aICq66vs7oUtE4lhDQYwxGY="//Provide your secret  
  18.             "scope ""https://graph.microsoft.com/.default"  
  19.         },  
  20.         success: function(response) {  
  21.             log(response);  
  22.             token = response.access_token;  
  23.             // console.log(token);  
  24.             RetrieveEmailFolder();  
  25.         },  
  26.         error: function(error) {  
  27.             log(JSON.stringify(error));  
  28.         }  
  29.     })  
  30. }  
  31. functionRetrieveEmailFolder() {  
  32.     $.ajax({  
  33.         method: 'GET',  
  34.         url: "https://graph.microsoft.com/v1.0/users/vinodhvignesh@sharepointtechie.onmicrosoft.com/mailFolders?select=displayName",  
  35.         headers: {  
  36.             'Authorization''Bearer ' + token,  
  37.             'Content-Type''application/json'  
  38.         },  
  39.     }).success(function(response) {  
  40.         vardata = response.value;  
  41.         log(data);  
  42.         map(function(folderinfo) {  
  43.             $('#display').append('<li>' + folderinfo.displayName + '</li>');  
  44.         })  
  45.     }).error(function(error) {});  
  46. } < /script> < ul id = "display" > < /ul>  

The final result is shown on the screen below.

Retrieve Mailbox Folders Using Microsoft Graph API 

So, in this article, I have explained retrieving the mail folders from your Office 365 mailbox. A lot more is to come in my upcoming articles. Stay tuned!!!

Happy coding!....