Edit

Share via


Extend TypeScript apps with more Microsoft Graph APIs

In this article, you add your own Microsoft Graph capabilities to the application you created in Build TypeScript apps with Microsoft Graph. For example, you might want to add a code snippet from Microsoft Graph documentation or Graph Explorer, or code that you created. This section is optional.

Update the app

  1. Open graphHelper.ts and add the following function.

    // This function serves as a playground for testing Graph snippets
    // or other code
    export async function makeGraphCallAsync() {
      // INSERT YOUR CODE HERE
    }
    
  2. Replace the empty makeGraphCallAsync function in index.ts with the following.

    async function makeGraphCallAsync() {
      try {
        await graphHelper.makeGraphCallAsync();
      } catch (err) {
        console.log(`Error making Graph call: ${err}`);
      }
    }
    

Choose an API

Find an API in Microsoft Graph you'd like to try. For example, the Create event API. You can use one of the examples in the API documentation, or you can customize an API request in Graph Explorer and use the generated snippet.

Configure permissions

Check the Permissions section of the reference documentation for your chosen API to see which authentication methods are supported. Some APIs don't support app-only, or personal Microsoft accounts, for example.

  • To call an API with user authentication (if the API supports user (delegated) authentication), add the required permission scope in appSettings.ts.
  • To call an API with app-only authentication, see the app-only authentication tutorial.

Add your code

Copy your code into the makeGraphCallAsync function in graphHelper.ts. If you're copying a snippet from documentation or Graph Explorer, be sure to rename the client to _userClient.

Now that you have a working app that calls Microsoft Graph, you can experiment and add new features.

Microsoft Graph Toolkit

If you're building TypeScript apps with UI, the Microsoft Graph Toolkit offers a collection of components that can simplify development.

TypeScript/JavaScript samples