Making a POST request to SharePoint from an SPFx webpart

In this post, let's see how to make an HTTP POST request from an SharePoint Framework (SPFx) web part. There are lots of posts out already which show you how to make a GET request so I will not cover that here. It is fairly straightforward once you understand all the moving parts.

Import the necessary modules in your SPFx webpart code:

import { SPHttpClient, ISPHttpClientOptions, SPHttpClientResponse } from '@microsoft/sp-http';

view raw SPFxPOSTImports.ts hosted with ❤ by GitHub

Now, the code which makes a POST request to create a list:

	private _makePOSTRequest(): void {
	const spOpts: ISPHttpClientOptions = {
	body: `{ Title: 'Developer Workbench', BaseTemplate: 100 }`
	};
	this.context.spHttpClient.post(`${this.context.pageContext.web.absoluteUrl}/_api/web/lists`, SPHttpClient.configurations.v1, spOpts)
	.then((response: SPHttpClientResponse) => {
	// Access properties of the response object.
	console.log(`Status code: ${response.status}`);
	console.log(`Status text: ${response.statusText}`);
	//response.json() returns a promise so you get access to the json in the resolve callback.
	response.json().then((responseJSON: JSON) => {
	console.log(responseJSON);
	});
	});
	}

view raw spfxPOST.ts hosted with ❤ by GitHub

And my "Developer workbench" list is created:

Hope this helps.