MS Graph and SPFx

Gašper Rupnik, SharePoint Developer, Kompas Xnet d.o.o.

SITES

GROUPS

ME

CONVERSATIONS CONTENT

INSIGHTS

CONTACTS

PEOPLE

ORGANIZATION

TASKSEMAIL

EVENTS

DOCUMENTS

DEVICES

CHATS

TEAMS

ACTIVITY

TRENDING

SHARED

REPORTS

Microsoft Graph

Microsoft Graph

Office 365 Platform

STANDALONE WEB AND

DEVICE APPS

Extensions

Embedded canvases

Users Groups Outlook OneNote more…SharePoint IntuneTeams Azure ADPlanner Excel

https://graph.microsoft.com

Your appOne endpoint

One token

All users

Microsoft Graph API

Access user, group and organizational data

Calling the API

• HTTP verbs dictate the request intent: GET | POST | PATCH | PUT | DELETE

• Version: /v1.0 or /beta

• Resource: /users, /groups, /sites, /drives, /devices, more…

• Member from collection: /users/AAA

• Property: /users/AAA/department

• Traverse to related resources via navigations: /users/AAA/events

• Query parameters: /users/AAA/events?$top=5

o Format results: $select | $orderby

o Control results: $filter | $expand

o Paging: $top | $skip | $skiptoken

/{version} ?{query-parameters}/{resource}/{id}/{property}

SDKs, samples and tooling

Calling the Microsoft Graph

MicrosoftGraph

Many different APIs to access data

Separate auth stacks for work and personal

State of the world before Microsoft Graph

Work and school Personal

Today’s world with Microsoft Graph

Microsoft Graph

(https://graph.microsoft.com/)

Work and school Personal

…

Connect to Microsoft Graph from Sharepoint (SPFx)

• Available from SPFx 1.4.1

• Helper class for connecting to Microsoft Graph

• Declarative permission scopes model

• Simplified Permission Grant model

Helper Class for Connecting to Microsoft Graph

•MSGraphClient

• Simplifies connecting to the Microsoft Graph

• Wraps existing Microsoft Graph JavaScript Client Library

• Handles authenticating for you

• Supports Microsoft Graph TypeScript Types

Declarative Permission Scopes Model

• Targets Multiple APIs

• Supports Microsoft Graph Scopes

• One per Solution

"webApiPermissionRequests": [{"resource": "Microsoft Graph","scope": "User.ReadBasic.All"}

Simplified Permission Grant Model

• Available in SharePoint Tenant Administration

• Tenant Admin Consent

Demos

Questions?

https://rasper87.wordpress.com

gasperr@kompas-xnet.si http://www.kompas-xnet.si

@RaspeR87 (Twitter)