Angular HttpClient：如何同时设置Bearer Token与responseType为blob？

没问题，我帮你调整代码，把Bearer Token请求头加上，同时保留blob类型的响应设置。下面是完整的解决方案：

你只需要在POST请求的配置选项里添加headers属性注入Bearer Token，同时保留responseType: 'blob'的设置即可。这里是调整好的完整代码：

import { HttpHeaders } from '@angular/common/http'; // 别忘了导入HttpHeaders类
import { saveAs } from 'file-saver';

public saveBook(format: string, req: Book) {
  const mediaType = 'application/pdf';
  // 这里替换成你实际获取token的方式，比如从localStorage或认证服务中取
  const authToken = localStorage.getItem('access_token'); 
  
  // 创建包含Bearer Token的请求头
  const requestHeaders = new HttpHeaders({
    'Authorization': `Bearer ${authToken}`
  });

  this.http.post(this.ApiUrl + '/PDFBook', req, {
    headers: requestHeaders, // 注入请求头
    responseType: 'blob'     // 保留blob响应类型设置
  }).subscribe((response) => {
    const blob = new Blob([response], { type: mediaType });
    saveAs(blob, `Book.${format.toLowerCase()}`);
  }, (error) => {
    // 建议加上错误处理，比如token失效、请求失败时给用户反馈
    console.error('保存书籍请求失败:', error);
  });
}

关键细节说明 #

• 一定要导入HttpHeaders，否则Angular无法识别这个请求头构造类
• 替换access_token为你实际存储token的键名（比如项目里可能用auth_token），如果token是从认证服务获取的，直接改成this.authService.getToken()这类方式即可
• 额外添加了错误处理逻辑，避免请求失败时没有任何反馈，提升代码健壮性

如果你的项目里有大量请求都需要携带Bearer Token，更优雅的方式是用HttpInterceptor全局注入请求头，不用每个请求都手动写headers。需要的话我可以再给你提供拦截器的实现示例~

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