如何使用 javascript 从 API 下载内联 pdf？

Question

我有一个后端可以处理带有 pdf 的各种操作，其中之一 - 将多个 pdf 合并为一个。

场景如下：

• 用户在一个虚拟列表中排列多个 pdf，并为该列表命名。
• 用户点击“下载列表”按钮。
• 通过 API 调用后端 (Laravel) 以合并所需的 pdf 并返回文件响应。 return response()->file(realpath($pathToFile), ['Content-Disposition' => 'inline; filename="'.$file,'Content-Type' => 'application/pdf']);

我需要做的是在新的 window 中打开这个收到的文件作为内联 pdf 预览，但我必须将它命名（我尝试使用 blob，但没有提供标题的选项），以便当用户点击“下载” pdf 查看器的按钮，他们得到一个命名下载，它由列表标题命名。 听起来像是一项非常基本的任务，但我找不到任何适当的解决方案来实现这一目标。 将 url 提供给文件而不是文件响应也不是一种选择，因为用户只能下载他们的列表，并且他们不应该能够直接通过 url 检索这些文件。

Answer 1

我设法通过绕行解决了我的问题，这可能不是最优化的解决方案，而且感觉有点 hack-ish，但这是唯一对我有用的解决方案。

我在我的 API 后端创建了两条路由：

第一条路线

Route::post('/download-file', 'PdfProcessController@downloadFileApi'); 接受文件id作为参数。 downloadFileApi方法检查用户是否有权访问所需文件，如果有，则使用Sanctum发出令牌$token = Auth::user()->createToken('access_file_token'); 最后，此方法返回 url，这是使用生成的令牌调用第二个 API 路由return sprintf('%s/api/download-file/%s?_token=%s', env('APP_URL'), $request->input('id'), $token->plainTextToken);

第二条路线Route::get('/download-file/{hash}', 'PdfProcessController@downloadFile')->middleware(['token.to.header', 'auth:sanctum']); token.to.header中间件是基于此答案实现的。 通过 Laravel Sanctum 进行身份验证，通过将令牌作为 GET 查询参数传递内部downloadFile令牌被破坏（因为它已被使用）并返回内联 Z43700941ED 。

在我的前端我做

this.$axios.post('/api/download-file', {id: fileid})
.then(response => {
  window.open(response.data, '_blank');
})