从 Web Api 获取 XML 到 Angular答案

【问题标题】：Fetching XML from Web Api to Angular从 Web Api 获取 XML 到 Angular
【发布时间】：2020-01-02 06:09:23
【问题描述】：

您好 StackOverflow 用户。

我想获取来自 web api (Asp.net Core) 的字符串

这是我的控制器的代码：

        [HttpPost("Xml")]
        public string Xml()
        {
            try
            {
                using (StreamReader reader = new StreamReader(Request.Body, Encoding.UTF8))
                {
                    return _xmlBeautifier.Beautify(reader.ReadToEnd());
                }

            }
            catch (Exception ex)
            {
                Console.WriteLine(ex.Message);
                Console.WriteLine(ex.StackTrace);
                throw ex;
            }
        }

这是我的 Angular 代码：

onSubmit() {

    const httpOptions = {
      headers: new HttpHeaders({
        'Accept': 'text/xml',
        'Content-Type': 'text/xml'
      })
    };

    this.http.post('http://localhost:5000/api/xml/xml', this.xmlForm.controls['XmlData'].value, httpOptions)
    .subscribe(res => {
      alert('SUCCESS !!');
    })
  }

我现在要做的是检查是否正确提取了 XML 字符串。我还没有代码来打印解析后的 XML，但我已经遇到了错误。

SyntaxError: Unexpected token

如何修复错误？我已经使用 Postman 测试了 API，它工作正常。

请看下面的截图

更新：

这是完整的错误信息：

 HttpErrorResponse {headers: HttpHeaders, status: 200, statusText: "OK", url: "http://localhost:5000/api/xml/xml", ok: false, …
    message: "Unexpected token < in JSON at position 0"
stack: "SyntaxError: Unexpected token < in JSON at position 0↵    at JSON.parse (<anonymous>)↵    at XMLHttpRequest.onLoad (http://localhost:4200/vendor.js:19139:51)↵    at ZoneDelegate.invokeTask (http://localhost:4200/poly


    headers: HttpHeaders {normalizedNames: Map(0), lazyUpdate: null, lazyInit: ƒ}
    message: "Http failure during parsing for http://localhost:5000/api/xml/xml"
    name: "HttpErrorResponse"
    ok: false
    status: 200
    statusText: "OK"
    url: "http://localhost:5000/api/xml/xml"

我也在使用来自creative-tim 的 paper-dashboard-angular 模板

更新：

我上传了示例 web api 和我正在使用的示例角度代码

https://github.com/AngularLearner18/WebAPI

https://github.com/AngularLearner18/Angular

【问题讨论】：

标签： angular asp.net-core asp.net-web-api2 angular7 asp.net-core-webapi

【解决方案1】：

HttpClient 的响应类型的默认值为 JSON。如果您想请求非 JSON 数据，只需将标头设置为以下内容：

this.http.get('...', { responseType: 'text' }); 
responseType?: 'arraybuffer' | 'blob' | 'json' | 'text'

在你的情况下，应该是

  onSubmit() {
    this.http.post('http://localhost:5000/api/xml/xml', { responseType: 'text' })
      .subscribe(res => {
        alert('SUCCESS !!');
      });
  }

【讨论】：

美好的一天。我仍然收到错误。我所做的是粘贴您的 onSubmit() 代码，但错误仍然存在。我更新了问题并粘贴了完整的错误，以防我错过了一个重要的细节。谢谢
我创建了一个示例问题来尝试您的解决方案，并且我可以使用上面的代码调用 API（我编辑了上面的评论）。否则，你能把你的代码贴在 GitHub 上让我在我的电脑上试用吗？
您好，您好。我更新了问题。我上传了 web api 和 angular 代码。截至目前，我尝试了您提供的解决方案，但仍然如此。它还没有工作。非常感谢您的时间和帮助
刚刚更新了解决方案。您只需要使用带有 responseType: text 的对象来传递给您的帖子选项。使用HttpHeader会报错。
它正在工作。非常感谢您的参与。 Stackoverflow 成员是最好的。