SharePoint Framework httpClient.post to _vti_bin/lists.asmx response

Question

JavaScriptのwebpartをSharepoint Frameworkに書き直そうとしています。

このウェブパーツでは、定期的な予定が入っているカレンダーリストからすべてのイベントを取得するために、/_vti_bin/Lists.asmxの石鹸ポストを作成する必要があります。

javascriptのコードは、この

wsURL = webUrl + "/_vti_bin/Lists.asmx"; 
    var xmlCall = 
     "<soap:Envelope xmlns:xsi='http://www.w3.org/2001/XMLSchema-instance' xmlns:xsd='http://www.w3.org/2001/XMLSchema' xmlns:soap='http://schemas.xmlsoap.org/soap/envelope/'> <soap:Body>" + 
     "<GetListItems xmlns='http://schemas.microsoft.com/sharepoint/soap/'>" + 
     "<listName>" + calendarList + "</listName>" + 
     "<query>" + 
     "<Query>" + 
     "<Where>" + 
      "<DateRangesOverlap>" + 
      "<FieldRef Name=\"EventDate\" />" + 
      "<FieldRef Name=\"EndDate\" />" + 
      "<FieldRef Name=\"RecurrenceID\" />" + 
      "<Value Type='DateTime'><Year/></Value>" + 
      "</DateRangesOverlap>" + 
     "</Where>" + 
     "</Query>" + 
     "</query>" + 
     "<queryOptions>" + 
     "<QueryOptions>" + 
      "<ExpandRecurrence>TRUE</ExpandRecurrence>" + 
     "</QueryOptions>" + 
     "</queryOptions>" + 
     "</GetListItems>" + 
     "</soap:Body></soap:Envelope>"; 

    var result = []; 
    $.ajax({ 
     url: wsURL, 
     type: "POST", 
     dataType: "xml", 
     async: false, 
     data: xmlCall, 
     complete: function (xData, status) { 
      if (status === "success") { 
       var root = $(xData.responseText); 
       root.find("listitems").children().children().each(function() { 
        $this = $(this); 
        var ids = $this.attr("ows_UniqueId").split(";"); 
        var rec = $this.attr("ows_fRecurrence"); 

         result.push({ 
          "StartTime": $this.attr("ows_EventDate"), 
          "EndTime": $this.attr("ows_EndDate"), 
          "Title": $this.attr("ows_Title"), 
          "Recurrence": (rec === "1" ? true : false), 
          "Description": $this.attr("ows_Description"), 
          "Guid": ids[1], 
          "Id": ids[0], 
         }); 

       }); 
      } 
     }, 
     contentType: "text/xml; charset=\"utf-8\"" 
    }); 
    return result; 
}; 

のように見えます。しかし、今、私はtypescriptですで、このコードを書き換えるしようとしているが、私は戻ってresponseTextを取得するように見えることはできませんか？

これは私が活字体で私のSharepointのフレームワークから石鹸Webサービスへの投稿を行うとバックXML応答を取得できますか私の活字体の機能

private makeRequest(listName: string): Promise<HttpClientResponse> { 

let wsURL = this.context.pageContext.web.absoluteUrl + "/_vti_bin/Lists.asmx"; 
var xmlCall = 
    "<soap:Envelope xmlns:xsi='http://www.w3.org/2001/XMLSchema-instance' xmlns:xsd='http://www.w3.org/2001/XMLSchema' xmlns:soap='http://schemas.xmlsoap.org/soap/envelope/'> <soap:Body>" + 
    "<GetListItems xmlns='http://schemas.microsoft.com/sharepoint/soap/'>" + 
    "<listName>" + listName + "</listName>" + 
    "<query>" + 
    "<Query>" + 
    "<Where>" + 
     "<DateRangesOverlap>" + 
     "<FieldRef Name=\"EventDate\" />" + 
     "<FieldRef Name=\"EndDate\" />" + 
     "<FieldRef Name=\"RecurrenceID\" />" + 
     "<Value Type='DateTime'><Year/></Value>" + 
     "</DateRangesOverlap>" + 
    "</Where>" + 
    "</Query>" + 
    "</query>" + 
    "<queryOptions>" + 
    "<QueryOptions>" + 
     "<ExpandRecurrence>TRUE</ExpandRecurrence>" + 
    "</QueryOptions>" + 
    "</queryOptions>" + 
    "</GetListItems>" + 
    "</soap:Body></soap:Envelope>"; 

    const requestHeaders: Headers = new Headers(); 
    requestHeaders.append('Content-type', "text/xml; charset=\"utf-8\""); 
    const httpClientOptions: IHttpClientOptions = { 
    body: xmlCall, 
    headers: requestHeaders 
    }; 

    console.log("About to make REST API request."); 

    return this.context.httpClient.post(
    wsURL, 
    HttpClient.configurations.v1, 
    httpClientOptions) 
    .then((response: HttpClientResponse) => { 
     console.log("REST API response received."); 
     console.log(response); 
     console.log(response.text()); 
     console.log(response.json()); 
     debugger; 
     return response.json(); 
    }); 
} 

のですか？

Answer 1

まあ、私はすべての作業を得た。

問題は、ポストコールのASYNCにデバッガコードを追加できないため、動作しないことです。第2に、SOAP投稿からlists.asmxへの応答は、HttpClientResponse型の応答ではなく、xmlを持つ単なる文字列です。

ので、関数は次のようになります。

private makeRequest(listName: string): Promise<string> { 

let wsURL = this.context.pageContext.web.absoluteUrl + "/_vti_bin/Lists.asmx"; 
var xmlCall = ` 
       <soap:Envelope xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/"> 
        <soap:Body> 
        <GetListItems xmlns="http://schemas.microsoft.com/sharepoint/soap/"> 
         <listName>${listName}</listName> 
         <query> 
         <Query> 
          <Where> 
          <DateRangesOverlap> 
           <FieldRef Name="EventDate" /> 
           <FieldRef Name="EndDate" /> 
           <FieldRef Name="RecurrenceID" /> 
           <Value Type="DateTime"><Year/></Value> 
          </DateRangesOverlap> 
          </Where> 
         </Query> 
         </query> 
         <queryOptions> 
         <QueryOptions> 
          <ExpandRecurrence>TRUE</ExpandRecurrence> 
         </QueryOptions> 
         </queryOptions> 
        </GetListItems> 
        </soap:Body> 
       </soap:Envelope> 
`; 

    const requestHeaders: Headers = new Headers(); 
    requestHeaders.append('Content-type', "text/xml; charset=\"utf-8\""); 
    const httpClientOptions: IHttpClientOptions = { 
    body: xmlCall, 
    headers: requestHeaders 
    }; 

    console.log("About to make REST API request."); 

    return this.context.httpClient.post(
    wsURL, 
    HttpClient.configurations.v1, 
    httpClientOptions) 
    .then(data => { 
     var result: any[]; 
     if(data.status == 200) 
     { 
     return data.text(); //returning the XML text of the response 
     } 
     else 
     { 
     return ""; 
     } 
    }); 
} 

と機能がこの

 this.makeRequest(this.properties.listdropdown) 
     .then((data) => { 
     let vArrEvents:any[] = []; 
     $(data).find("listitems").children().children().each((index, element) => { 
      let ids = $(element).attr("ows_UniqueId").split(";"); 
      let rec = $(element).attr("ows_fRecurrence"); 
      let strMatch:any[] = $(element).attr("ows_EventDate").match(/^(\d+)-(\d+)-(\d+) (\d+)\:(\d+)\:(\d+)$/); 
      let startDate = new Date(strMatch[1], strMatch[2] - 1, strMatch[3], strMatch[4], strMatch[5], strMatch[6]); 
      let today = new Date(); 
      today.setHours(0,0,0); 
      if(startDate >= today) 
      { 
      vArrEvents.push({ 
        "StartTime": $(element).attr("ows_EventDate"), 
        "EndTime": $(element).attr("ows_EndDate"), 
        "Title": $(element).attr("ows_Title"), 
        "Recurrence": (rec === "1" ? true : false), 
        "Description": $(element).attr("ows_Description"), 
        "Guid": ids[1], 
        "Id": ids[0], 
       }); 
      } 
     }); 
     this.showEvents(vArrEvents); 
     this.context.statusRenderer.clearLoadingIndicator(this.domElement); 
     }); 

のように呼ばれています