Forum Discussion

Vivek Gupta's avatar
Vivek Gupta
Copper Contributor
Mar 12, 2018

How to show the Site Collection List using SharePoint Framework Client Side Web Part in Office 365?

Hi,

How to show the Site Collection List which is accessible to the user using SharePoint Framework Client Side Web Part in Office 365?

Please provide a example.

Thanks in advance.

    • Vivek Gupta's avatar
      Vivek Gupta
      Copper Contributor

      Hi Paul,

       

      Thanks for the reply.

       

      However, I am not able to get the Site Collection List using the _getListData() method in GetSiteCollectionListWebPart.ts in O365 using SharePoint Framework (SPFx):

       

      export interface ISiteCollectionLists {
      value: ISiteCollectionList[];
      }

       

      export interface ISiteCollectionList {
      SiteCollectionName: string;
      SiteCollectionUrl: string;
      }

       

      private _getListData(): Promise<ISiteCollectionLists> {
      return this.context.spHttpClient.get(this.context.pageContext.web.absoluteUrl + "/_api/search/query?querytext='contentclass:sts_site'", SPHttpClient.configurations.v1)
      .then((response) => {
      return response.json();
      });
      }

       

      Please let me know the corrections to be made in _getListData() method.

       

      Thanks in advance.

       

      • paulpascha's avatar
        paulpascha
        Bronze Contributor

        I noticed a HTTP 500 server error occurs in your code. This has to do with the OData version being supporoted by SP Search REST API. After changing your _getListData method as below I got it working:

         

        private _getListData(): Promise<ISiteCollectionLists> {
            const spSearchConfig: ISPHttpClientConfiguration = {
              defaultODataVersion: ODataVersion.v3
            };
        
            return this.context.spHttpClient.get(this.context.pageContext.web.absoluteUrl + "/_api/search/query?querytext='contentclass:sts_site'", SPHttpClient.configurations.v1.overrideWith(spSearchConfig))
              .then((response) => {
                return response.json();
              });
          }

        You have to import some additional types for the above to work, see the blog below for details:

        http://www.vrdmn.com/2017/01/working-with-rest-api-in-sharepoint.html

         

        Hope this helps!

         

Resources