Use the Microsoft Search API to query data

This sample was added after the 30 Days of Microsoft Graph blog series and as such has limited documentation. The key points to note:

• Prerequisites
• Step 1: Start Backend
• Step 2: Start Frontend
• Step 3: Try the demo

Prerequisites

• Permissions required

  • Delegated (work or school account)
    • Mail.Read, Mail.ReadWrite, Calendars.Read, Calendars.ReadWrite, Files.Read.All, Files.ReadWrite.All, Sites.Read.All, Sites.ReadWrite.All, ExternalItem.Read.All

• Visual Studio Code installed on your development machine. If you do not have Visual Studio Code, visit the previous link for download options. (Note: This tutorial was written with Visual Studio Code version 1.55.2. The steps in this guide may work with other versions, but that has not been tested.)

• Visual Studio. (Note This tutorial was written with Visual Studio 2019. The steps in this guide may work with other versions, but that has not been tested.), when start installation, please:

  • Make sure you installed the ASP.NET & web development under the Web & Cloud
  • Make sure you installed .Net desktop development under the Desktop & Mobile

• If you want to extend authentication, please refer the guides before or try to use this MSAL sample or go to Azure Document for getting auth helps. In this guide, please ensure you have a way to get a token for accessing graph endpoint. Try Graph Explorer and got a token from there.

• Nodejs This tutorial was written with NodeJS version 14.15.4. Please click the link then install the nodeJS

Step 1: Start Backend

Double click day30Sample.sln under the backend/Csharp/day30Sample

Open Package Manager

, type below and enter

dotnet restore

Run Project

After starting the backend, you will see below and please keep the browser window.

Step 2: Start Frontend

Open commandline on your PC

run command below:

npm install -g @angular/cli

• Open Visual Studio Code, and import frontend project.
• 

Open a Terminal in Visual Studio Code

Run npm install in the terminal as below, it will take a little long time:

Run ng serve, start project

After starting successfully, go http://localhost:4200, will see below:

Step 3: Try the demo

Set a token in welcome page, Graph Explorer and got a token from there.

Click Search Button,