Angular 4中HTTP PUT请求未执行，请求确认空体语法正确性

嘿，我来帮你拆解下这段代码的问题：

首先明确说：你用null作为PUT请求体的语法是完全正确的，Angular的HttpClient.put()方法允许第二个参数传null来表示空请求体，这部分符合规范。不过代码里还有几个可以优化的点，以及一些可能导致请求没生效的排查方向：

一、代码优化建议 #

• 请求头写法简化：你创建HttpHeaders的方式可以更简洁，不用链式调用set，直接在构造函数里传入对象即可：

  const requestHeaders = new HttpHeaders({'Content-Type': 'application/json'});
  

• 响应处理的合理性：你设置了responseType: 'text' as 'text'，然后又手动JSON.parse(rez)——如果服务器返回的本来就是JSON格式的响应，其实完全可以省略responseType（默认就是json），这样Angular会自动帮你解析成对象，省去手动parse的步骤；如果服务器确实返回纯文本格式的JSON字符串，那当前写法没问题，但要确保返回的文本是合法的JSON，否则JSON.parse会抛出错误。
• 错误处理的兼容性：Angular 4里的HttpClient返回的Observable需要用catchError操作符（从rxjs/operators导入）来处理错误，旧的catch已经被废弃了，所以错误处理部分应该改成这样：

  import { catchError, map } from 'rxjs/operators';
  
  // ...
  return this.httpClient.put(
    `${this.endpointUrl}/${id}`, 
    null, 
    { headers: requestHeaders, responseType: 'text' as 'text' }
  ).pipe(
    map(rez => JSON.parse(rez)),
    catchError(error => this.handleError(error))
  );
  

二、请求没生效的排查方向 #

如果控制台没报错，但请求似乎没起作用，大概率是这两个常见问题：

• 有没有订阅Observable？：HttpClient的请求是冷Observable，必须调用.subscribe()才会真正发起请求！比如你调用approve(id)的时候，是不是只写了this.service.approve('xxx')而没有订阅？正确的调用方式应该是：

  this.yourService.approve('123').subscribe(
    (result) => console.log('请求成功', result),
    (error) => console.log('请求失败', error)
  );
  

• 检查请求是否真的发出：打开浏览器开发者工具的「Network」标签，筛选PUT请求，查看请求的状态码、请求头、响应内容，确认请求是否到达了服务器，以及服务器返回了什么状态（比如200表示成功，4xx/5xx表示后端报错）。另外也要确认后端是否接受空请求体的PUT请求，有些后端框架可能对请求体有强制要求。

内容的提问来源于stack exchange，提问作者annepic