I am trying to get data in SPFx using REST and also need to use CAML for making the query. CAML is required as I want to filter based on certain groups the user is present in, so giving that up is not an option.

I have made the code simple below but this still gives me 400 Bad request. I get the data when I use the below url (after changing getItems to items) directly in browser.

Please tell me what am I doing wrong here:

 this._selectedList = "List1";
 var queryString = "<View></View>";

 const options: ISPHttpClientOptions = { headers: { 'odata-version': '3.0'},
 body: JSON.stringify({'query': {'__metadata': {'type': 'SP.CamlQuery'},'ViewXml': queryString }})
 var getUrl = this._listsUrl + "/GetByTitle('" + this._selectedList + "')/getitems?$select=Title"; 

 return this._webPartContext.spHttpClient.post(getUrl, SPHttpClient.configurations.v1,options)
    .then((response: SPHttpClientResponse) => {
    return response.json();
  • Try adding viewfields in query string. – user80093 Feb 26 '19 at 12:14
  • I am getting error for AssignedTo field when I try to use in REST Url. Will, using it in View Fields can resolve the issue? – zainul Feb 27 '19 at 10:37

If you're trying to query SharePoint REST API's, you should use PNPJS instead of manually crafting the requests. It provides a fluent API for the API and that will make a lot of things simpler.
For your specific case, look at the documentation, especially the queries with "select", which is the equivalent of selecting specific fields of the list.
Because you're building SharePoint Framework components, you should also look at the getting started documentation.

| improve this answer | |

Most likely you have made an error in here -- this._listsUrl

The value of this._listsUrl needs to something like https://tenant.sharepoint.com/sites/test/_api/web/lists.

So try and hard-code the URL and then check, try and modify it as below, rest of your code looks ok:

var getUrl = "https://tenant.sharepoint.com/sites/test/_api/web/lists
/GetByTitle('" + this._selectedList + "')/getitems?$select=Title"; 
| improve this answer | |

Try below.

const options: ISPHttpClientOptions = {
      headers: {'odata-version':'3.0'},
      body: `{'query': {
        '__metadata': {'type': 'SP.CamlQuery'},
        'ViewXml': '<View><Query><OrderBy><FieldRef Name="ID"" /></OrderBy></Query></View>'

    return this.context.spHttpClient.post(this.context.pageContext.web.absoluteUrl + `/_api/web/lists/GetByTitle('listName')/GetItems`, SPHttpClient.configurations.v1,options)
      .then((response: SPHttpClientResponse) => {
        return response.json();
| improve this answer | |

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.