如何在新浏览器标签页展示Node.js get请求返回的PDF响应？

我来给你捋清楚怎么实现这个需求——既然你已经确认响应体里的PDF数据是对的，核心就是把这些二进制数据转换成浏览器能识别的格式，再生成临时URL来打开。

具体代码实现 #

$http.get('/your-pdf-api-path', {
  // 关键配置：告诉$http不要自动解析响应，返回原始二进制数据
  responseType: 'arraybuffer'
})
.then(function(res) {
  // 将二进制响应数据包装成PDF类型的Blob对象
  const pdfBlob = new Blob([res.data], { type: 'application/pdf' });
  
  // 创建浏览器可识别的临时本地URL
  const pdfObjectUrl = URL.createObjectURL(pdfBlob);
  
  // 在新标签页打开这个URL，浏览器会自动调用内置PDF阅读器展示
  window.open(pdfObjectUrl, '_blank');
  
  // 可选但推荐：页面卸载时释放临时URL，避免内存泄漏
  window.addEventListener('unload', () => {
    URL.revokeObjectURL(pdfObjectUrl);
  });
})
.catch(function(error) {
  console.error('获取PDF失败:', error);
});

关键细节解释 #

• 设置responseType: 这一步不能少！默认情况下$http会把响应解析成JSON，必须指定arraybuffer（或blob）才能拿到原始的PDF二进制数据。
• Blob转换: Blob是浏览器用来存储二进制数据的容器，指定type: 'application/pdf'能让浏览器明确知道这是PDF文件，触发对应的阅读器。
• 临时URL生成: URL.createObjectURL会生成一个指向Blob的本地临时链接，这个链接可以直接被浏览器识别并渲染PDF。
• 内存释放: 临时URL会占用浏览器内存，所以在页面关闭/卸载时调用URL.revokeObjectURL清理资源是个好习惯。

如果你的后端返回的响应本身就是Blob类型，那可以跳过Blob转换步骤，直接用res.data创建临时URL即可。

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