Help with post request from SPFx secured by AD

Question

https://docs.microsoft.com/en-us/sharepoint/dev/spfx/use-aadhttpclient-enterpriseapi < I have a few GET requests working in my SPFx app, but the guide here doesen't show you how to do a POST request with a payload which I can't get working.

Can anyone see where I am going wrong with the POST request:

Getting 500 error.

public updateProfile(nonDirectorTemp, directorTemp) {

    const spOpts: IHttpClientOptions = { 
        body: `{
        "PersonName": ${this.state?.currentUser?.name},
        "Declarations":  ${nonDirectorTemp.concat(directorTemp)
      }`
    };

    this.context.httpClient.post('https://f*********al-dev.azurewebsites.net/api/UpdateUserProfile', AadHttpClient.configurations.v1, spOpts)
    .then((res: HttpClientResponse): Promise<any> => {
      return res.json();
    })
    .then(() => {
      this.setState({ success: true }, () => setTimeout(() => {this.setState({ success: null });}, 1500));
    })
    .catch(error => this.setState({ error: error, isLoading: false }, () => setTimeout(() => {this.setState({ error: null });}, 1500))
   );

  }

Answer 1

That is how you do it:

this.httpClient.post('https://fu********al-dev.azurewebsites.net/api/UpdateUserProfile', AadHttpClient.configurations.v1, {
  body: JSON.stringify({
    "PersonName": this.state?.currentUser?.name,
    "Declarations": nonDirectorTemp.concat(directorTemp)
  })
})