Laravel：将PDF文件从Controller传递到JavaScript变量-php教程-PHP中文网

Laravel：将PDF文件从Controller传递到JavaScript变量

DDD

发布： 2025-08-07 16:04:01

原创

870人浏览过

laravel：将pdf文件从controller传递到javascript变量

在Laravel项目中，有时需要在前端JavaScript代码中使用服务器端存储的PDF文件。直接将PDF文件内容传递到前端可能效率较低。一种更有效的方法是将PDF文件的URL传递到前端，然后让前端根据URL请求PDF文件。本文将详细介绍如何实现这一过程。

1. Controller端处理

首先，需要在Controller中获取PDF文件的URL。假设PDF文件存储在test_docs磁盘中，并且是公开可访问的。

<?php

namespace App\Http\Controllers;

use Illuminate\Support\Facades\Storage;

class TestController extends Controller
{
    public function getPDFDocs()
    {
        $files = [];

        if (Storage::disk('test_docs')->exists('testFirstFile.pdf')) {
            // 假设文件是公开可访问的，使用 url 方法
            $files[1] = Storage::disk('test_docs')->url('testFirstFile.pdf');
        }

        if (Storage::disk('test_docs')->exists('testSecondFile.pdf')) {
            // 假设文件是公开可访问的，使用 url 方法
            $files[2] = Storage::disk('test_docs')->url('testSecondFile.pdf');
        }

        return view('test.index', ['files' => $files]);
    }
}

登录后复制

这段代码首先检查文件是否存在，然后使用Storage::disk('test_docs')->url()方法获取PDF文件的URL。最后，将包含PDF文件URL的数组传递给test.index视图。

注意事项：

商汤商量

商汤科技研发的AI对话工具，商量商量，都能解决。

查看详情

立即学习“Java免费学习笔记（深入）”；

确保test_docs磁盘已正确配置，并且文件是公开可访问的。
url()方法返回的是文件的完整URL，包括域名和路径。

2. Blade模板处理

在Blade模板中，需要将Controller传递过来的$files数组转换为JSON格式，并将其存储在HTML元素的data-属性中。

<!-- 写入你的HTML代码 -->
<span id="filesdata" data-files="{{ json_encode($files) }}"></span>

@section('loadjs')
    <script>
        var filesJson = document.getElementById('filesdata').getAttribute('data-files');
        var files = JSON.parse(filesJson);

        // 现在你有了你的文件URL，可以进行后续操作
        console.log(files);

        function getPDFPages() {
            let visible = [];

            // visible.push({pages here??})
        }
    </script>
@endsection

登录后复制

这段代码首先创建一个<span>元素，并将其id设置为filesdata。然后，使用json_encode($files)将$files数组转换为JSON字符串，并将其存储在data-files属性中。

在@section('loadjs')中，首先获取data-files属性的值，然后使用JSON.parse()将JSON字符串解析为JavaScript对象。现在，你可以在JavaScript代码中使用files变量来访问PDF文件的URL。

注意事项：

立即学习“Java免费学习笔记（深入）”；

确保在@section('loadjs')中添加<script>标签，以便正确执行JavaScript代码。
JSON.parse()方法可能会抛出异常，因此建议使用try-catch块来处理可能的错误。

3. JavaScript端处理

在JavaScript代码中，可以使用获取到的PDF文件URL来显示PDF文件。可以使用<iframe>元素或PDF.js等库来实现PDF文件的显示。

例如，可以使用以下代码将第一个PDF文件显示在<iframe>元素中：

var iframe = document.createElement('iframe');
iframe.src = files[1];
document.body.appendChild(iframe);

登录后复制

这段代码首先创建一个<iframe>元素，然后将其src属性设置为第一个PDF文件的URL。最后，将<iframe>元素添加到<body>元素中。

注意事项：

立即学习“Java免费学习笔记（深入）”；

确保<iframe>元素的src属性设置为有效的PDF文件URL。
根据需要调整<iframe>元素的样式和大小。
如果需要更高级的PDF文件处理功能，可以使用PDF.js等库。

总结

本文介绍了一种在Laravel项目中，将PDF文件URL从Controller传递到JavaScript变量的方法。通过将PDF文件URL存储在HTML元素的data-属性中，可以方便地在JavaScript代码中访问这些URL，并根据需要进行后续处理。这种方法可以提高效率，并简化PDF文件在前端的展示。

以上就是Laravel：将PDF文件从Controller传递到JavaScript变量的详细内容，更多请关注php中文网其它相关文章！