Batch REST requests in SharePoint Framework (SPFx) using SPHttpClientBatch

This post has been updated on 5th March 2017 for the SharePoint Framework 1.0 (GA) release.

All the code for this, as always, is on GitHub: https://github.com/vman/SPFx-REST-Operations

This is one of my favorite things in the SharePoint Framework right now. The ability to easily batch REST API calls and send them to SharePoint in a single request.

There is a new class called SPHttpClientBatch which is used to combine multiple REST requests. You can find more about this in the API docs:
https://dev.office.com/sharepoint/reference/spdx/sp-http/sphttpclient

As shown in the docs, the SPHttpClientBatch class has 2 primary methods: execute and fetch. The fetch method is used to queue all the different requests and execute is used to execute them all at once.

The get and post methods are syntactical sugar to call fetch but with the method parameter set to GET or POST.

The amazing thing about the fetch method is that it returns a Promise object which correlates to the API call being made. This way, when the Promise gets resolved/rejected after the execute method, we can easily track the response. This is better explained in the code below :)

So let's have a look at how we can utilize the SPHttpClientBatch class in an SPFx webpart:

First, we will need to import all the necessary modules:

And here is the actual code:



When this code is executed, we can see that a single batch request is sent to SharePoint containing the information about the requests in the Payload:

(click to zoom)

And when the Response is returned, we can hook into each individual Promise object to get its value:

(click to zoom)

Isn't this Awesome? It is going to save a lot of round trips to the server and also help in performance optimization.

Thanks for reading!