Angular HttpClient.post接收服务端XML返回报错无法读取问题

云上老周

2026-8-28

问题排查结论

触发报错、拿不到响应数据的核心原因共3点：

Content-Type请求头配置错误：该头用于标记发往服务端的请求体格式，你提交的是IJob类型的JS对象，默认会被序列化为JSON传输，手动设置为application/xml会导致服务端解析请求体失败
Angular HttpClient默认将所有响应当JSON格式解析，服务端返回的是XML纯文本，默认JSON解析逻辑会直接抛出语法错误，即便浏览器网络面板能看到原始响应内容，业务代码层也无法拿到解析成功的返回值
组件中调用的data.text()是原生Fetch API返回的Response对象的内置方法，默认配置下HttpClient不会返回原生Response实例，调用该方法会直接报"不是函数"的错误

修正方案

服务类代码调整

核心改动两个：

删除错误的手动Content-Type设置，传JS对象时HttpClient会自动完成JSON序列化、设置正确的请求头
新增responseType: 'text'配置项，告知HttpClient直接返回原始文本响应，跳过默认的JSON解析流程
修正后代码：

public createXML(data:IJob)
{
    console.log("createXML - POST data to server: ", data);
    return this.httpClient.post(
      environment.restUrl + "/createXML/",
      data,
      { responseType: 'text' }
    )
    .pipe(
      tap((res) => console.log("服务端返回原始XML：", res)),
      catchError(this.handleError)
    );
}

组件类代码调整

设置responseType: 'text'后，订阅拿到的返回值直接就是XML格式的字符串，不需要再调用.text()做转换，直接传入下载方法即可：

createXML(data:IJob):void{
  this.coreService.createXML(data).subscribe(
    (xmlStr: string) => {
      console.log('XML文件内容', xmlStr);
      this.downloadFile(xmlStr, 'lot', 'gtin');
    }, 
    (err: any) => {
      console.log('请求异常：', err);
    }
  );
}