如何从 Angular 应用程序打开 PDF 文件

Question

我正在构建一个使用 PHP 后端的 Angular 应用程序。 过程是：

• 前端调用后端端点
• 后端构建一个PDF文件，存放在特定文件夹中，并返回文件URL（http://serverhost/tmp/somerandompath/somerandomname.pdf）
• 由于其 URL，前面会打开一个指向 PDF 文件的新标签

我的问题是 PDF url 被 Angular 路由器拦截，用户被重定向到主页（默认行为）而不是 PDF 文件。

这是我的（简化的）路由配置：

const appRoutes: Routes = [
  { path: 'route1', component: Component1 },
  { path: 'route2', component: Component2 },
  { path: 'home', component: HomepageComponent },
  { path: '**', component: HomepageComponent }
];

您知道如何打开 PDF 文件吗？

感谢您的帮助，泰尔摩斯

Answer 1

首先，我认为您的服务网址不正确，请先修复它，然后您可以使用此 *** ng2-pdf-viewer *** 包在客户端呈现 pdf

<pdf-viewer [src]="pdfSrc"
          [render-text]="true"
          style="display: block;"
 ></pdf-viewer>

https://github.com/VadimDez/ng2-pdf-viewer#readme