SPFX React Updating Document Library file metadata using Rest API 404 issue

Question

I have created a SPFX Extension on a library and trying to update file metadata which is inside a specific folder in document library. I have the item ID for that particular file, but getting 404 issue. Here is the sample code which have been using,

this.spHttpClient.post(`${url}`,
  SPHttpClient.configurations.v1,
  {
    headers: {
      "Accept": "application/json; odata=verbose",
      'content-type': 'application/json;odata=verbose',
      "X-RequestDigest": requestDigest,
      "X-Http-Method": "MERGE",
      "If-Match": "*"
    },
    body: JSON.stringify({
      "__metadata": { "type": "SP.Data.10Q_x0020_and_x0020_10K_x0020_Filing_x0020_UnzippedItem" },
      "Title": titleLinkUrl
    })
  })
  .then((response: SPHttpClientResponse): void => {
    alert('sucess')
  }).catch(error => {
    console.error(error);
  })

}

Answer 1

404 error usually means not getting the valid list item.

Suggest to test the Rest Endpoint in Browser to see if there is Json returned. body and headers should be correct. I tested a sample code in my side, please refer:

private updateItem() {

  var posturl = this.props.context.pageContext.web.absoluteUrl + `/_api/web/lists/GetByTitle('doc2')/items(10)`;
  var payload = JSON.stringify({
    "__metadata": {
      "type": "SP.Data.Doc2Item"
    },
    "Title": "UpdatedTitle"
  });

  var option = {
    headers: {
      'IF-MATCH': '*',
      'Content-type': 'application/json;odata=verbose',
      "accept": "application/json;odata=verbose",
      "odata-version":"3.0",
      'X-HTTP-Method': 'PATCH'
    },
    body: payload
  };

  return this.props.context.spHttpClient.post(posturl, SPHttpClient.configurations.v1, option).then((response: SPHttpClientResponse) => {
    alert(response.status + ':' + response.ok);

  });
}


  var option = {
    headers: {
      'IF-MATCH': '*',
      'Content-type': 'application/json;odata=verbose',
      "accept": "application/json;odata=verbose",
      "odata-version":"3.0",
      'X-HTTP-Method': 'PATCH'
    },
    body: payload
  };

  return this.props.context.spHttpClient.post(posturl, SPHttpClient.configurations.v1, option).then((response: SPHttpClientResponse) => {
    alert(response.status + ':' + response.ok);

  });
}