Laravel 8 文件的上传/下载/显示的实例

article/2025/11/3 23:33:22

如何实现对文件的操作，实现上传，下载，展示等等功能，我们通过编写一个简单的实例来了解其中具体的内容。

文件列表的展示/文件上传/文件下载

首先我们需要创建两个文件，一个视图文件，一个控制器，来实现前后端的互通，然后我们在 storage\app\ 创建一个 uploadfiles 的文件夹，用于存储文件。

创建一个名为 filesmanagement.blade.php 的视图文件，包括基本的样式和布局，如下图：

<!doctype html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><!-- CSRF Token --><meta name="csrf-token" content="{{ csrf_token() }}"><title>Files Management</title><!-- Scripts --><script src="{{ asset('js/app.js') }}" defer></script><!-- Fonts --><link rel="dns-prefetch" href="//fonts.gstatic.com"><link href="https://fonts.googleapis.com/css?family=Nunito" rel="stylesheet"><!-- Styles --><link href="{{ asset('css/app.css') }}" rel="stylesheet">
</head>
<body><div id="app"><nav class="navbar navbar-expand-md navbar-light bg-white shadow-sm"><div> This is a demo for file show, upload, download </div></nav><main class="py-4"><div class="container"><div class="row justify-content-center"><div class="col-md-10"><div class="card"><div class="card-header">Files Management</div><div class="card-body"><form><!-- 具体的内容稍后填充 --></form></div></div></div></div></div></main></div>
</body>
</html>

创建一个名为 FilesManagementController.php 的控制器，里面包含三个方法，如下：

<?phpnamespace App\Http\Controllers\TryDemo;use App\Http\Controllers\Controller;class FilesManagementController extends Controller
{public function showFiles(){// 页面展示文件列表}public function uploadFile(){// 上传文件时调用}public function downloadFile(){// 下载文件时调用}}

然后我们需要在路由配置文件里添加对控制器里具体方法的调用，如下图：


进入页面，展示所有文件列表
Route::get('/files', [App\Http\Controllers\TryDemo\FilesManagementController::class, 'showFiles']);通过 form 表单提交上传的文件
设置此路由名为 UploadFile，之后会在视图文件里使用
Route::post('/files', [App\Http\Controllers\TryDemo\FilesManagementController::class, 'uploadFile'])->name('UploadFile');通过点击文件列表的超链接，在浏览器下载指定的文件，{filename} 为文件名，作为参数传入控制器
设置此路由名为 DownloadFile，之后会在视图文件里使用
Route::get('/files/{filename}', [App\Http\Controllers\TryDemo\FilesManagementController::class, 'downloadFile'])->name('DownloadFile');

路由配置已搭建好，在继续完善实例之前，我们需要先了解一下关于文件存储的一些概念，首先在项目的根目录下有两个文件夹目录，storage和 public ，storage 和 public 目录的主要区别在于 storage 目录是用于存放应用程序生成的文件，例如日志文件、缓存文件、上传的文件等等。而 public 目录是用于存放公开访问的文件，例如图片、CSS、JavaScript 文件等等。由于后面我们要将文件存放于这里，所以我们需要了解这两个位置的路径是如何通过函数获取的，如下图：


函数返回值为项目根目录路径
base_path();
返回值为：/var/www/mydemo （mydemo为项目目录名）base_path('storage/app/uploadfiles/AAA.txt');
返回值为：/var/www/mydemo/storage/app/uploadfiles/AAA.txt函数返回值为 storage 文件夹的根目录路径
storage_path();
返回值为：/var/www/mydemo/storagestorage_path('app/uploadfiles/AAA.txt');
返回值：/var/www/mydemo/storage/app/uploadfiles/AAA.txt函数返回值为 public 文件夹的根目录路径
public_path();
返回值为：/var/www/mydemo/public如果建立软连接，public_path() 里可以传入定义的软连接的名字，来获取真正的路径
public_path('myuploadfiles');
返回值为：/var/www/mydemo/public/myuploadfiles
注：我们这里的 myuploadfiles 为设定的软连接名，其实真实指向的是 /var/www/mydemo/storage/app/uploadfiles
稍后会解释什么是软连接需要引入 use Illuminate\Support\Facades\Storage
函数返回值为 storage/app/ 的根目录路径
Storage::path('uploadfiles/AAA.txt'); 
返回值为：/var/www/mydemo/storage/app/uploadfiles/AAA.txt

对于文件的操控，常用的函数如下：

需要引入 File 类
use Illuminate\Support\Facades\File;获取 app/uploadfiles 文件夹下的所有文件对象
$fileObjArray = File::files(storage_path('app/uploadfiles'));通过循环获得 file 对象，并可以调用其文件操作的函数
foreach ($fileObjArray  as $fileObj) {$fileObj->getPathname(); // 获取文件的路径和文件名$fileObj->getPath(); // 获取文件所在目录的路径$fileObj->getFilename(); // 获取文件名（不包含路径）$fileObj->getExtension(); // 获取文件扩展名（不包含点）$fileObj->getSize(); // 获取文件大小（字节数）$fileObj->getMTime(); // 获取文件的修改时间（Unix 时间戳）$fileObj->isFile(); // 判断文件是否是普通文件$fileObj->isDir(); // 判断文件是否是目录$fileObj->isLink(); // 判断文件是否是符号链接$fileObj->isReadable(); // 判断文件是否可读$fileObj->isWritable(); // 判断文件是否可写
}如果想获取单个文件对象，需要引入
use SplFileInfo;创建这个文件的 file 对象
$fileObj = new SplFileInfo($fileFullPath);
注：$fileFullPath 为文件的完整路径

了解完文件操作的基本内容后，我们来完善控制器里面的方法，如下图：

use Illuminate\Support\Facades\Storage;
use Illuminate\Support\Facades\File;public function showFiles()
{获取 uploadfiles 文件夹下所有的文件对象数组$fileObjArray = File::files(Storage::path('uploadfiles'));将文件对象数组传到视图文件中return view('files.filesmanagement', ['fileObjArray' => $fileObjArray]);
}public function uploadFile(Request $request)
{接收通过视图文件传来的上传的文件对象$file = $request->file('uploadfile');组成完整的文件路径，storeAs 默认是从 storage/app 目录开始$path = $file->storeAs('uploadfiles', $file->getClientOriginalName());上传成功后返回原页面return redirect()->back()->with('success', 'File uploaded successfully.');
}public function downloadFile($filename)
{获取要下载的文件的完整路径$path = Storage::path('uploadfiles/'.$filename);通过浏览器下载文件return response()->download($path, $filename);
}

然后我们开始填充视图文件的具体内容，通过控件调用路由来实现控制器里的逻辑，如下图：

<form method="POST" enctype="multipart/form-data" action="{{ route('UploadFile') }}">@csrf<div class="row mb-3"><label for="name" class="col-md-2 col-form-label text-md-end">Show Files</label><div class="col-md-8"><ul class="list-group">@if (count($fileObjArray) > 0)@foreach ($fileObjArray as $fileObj)<li class="list-group-item"><p>{{ $fileObj->getPathname() }}</p><div class="d-flex justify-content-end"><a href="{{ route('DownloadFile', ['filename' => $fileObj->getFilename()]) }}"> Download </a></div></li>@endforeach@endif</ul></div></div><div class="row mb-3"><label for="email" class="col-md-4 col-form-label text-md-end">Upload File</label><div class="col-md-6"><input id="uploadfile" type="file" class="form-control" name="uploadfile" value=""></div></div><div class="row mb-3"><div class="col-md-6 offset-md-4"><button type="submit" class="btn btn-primary">Upload File</button></div></div>
</form>

所有功能都已补充完整，通过浏览器可以进行尝试，如下图：

如何设置软链接

此时对于文件列表的展示，文件的上传和下载功能已完成，我们再尝试一个在页面展示一张已上传的图片，这里就需要了解一个概念，叫软链接。因为 storage 文件夹虽然用于存储文件，但是这个文件夹是不对外公开的，所以如果你想要通过文件的地址来指向具体文件来展示在页面，会提示 404 找不到文件。这里我们需要通过软链接将这个不对外公开的文件夹跟一个公开的文件夹链接，通过指向公开文件夹的路径来找到其指定的文件，这个公开的文件夹就是 public 文件夹，下面我们来讲解一下如何进行软链接操作，首先打开文件配置文件 config\filesystems.php，在最下方找到软链接的配置，如下图：

通过上图可以看到，我们已经配置两个软链接，名为 storage 的软链接指向的是 storage/app/public 文件夹，名为 myuploadfiles 的软链接指向的是 storage/app/uploadfiles 文件夹。当你在配置文件里什么都不配置的时候，直接运行如下命令，系统会自动生成名为 storage 的软链接。 

php artisan storage:link

命令运行成功后会提示软链接的具体内容，如下图：

当然你也可以像我一样自定义一个软链接，如 myuploadfiles 来指定你自己存放文件的路径，要记得在填写完配置文件后，要再次运行 php artisan storage:link 命令才能生效，不过如果之前已经生成软链接的路径，在命令运行结束后会提示你软链接的路径已存在，需要注意，如下图：

如何在浏览器展示图片文件

当软链接创建成功后，我们就可以直接在视图文件通过 URL 来展示图片了，如下图：

<form>...
</form><div class="row mb-0"><img src="{{ asset('myuploadfiles/t1.png') }}" alt="show pic">
</div>asset() 方法会默认指向 public 文件夹，
在里面传入参数（软连接名和文件名拼接的路径），即可获得完整的图片路径

此时运行浏览器，可以看到图片展示成功了，如下：

如何在浏览器展示 PDF 文件

添加一个 showPDF() 的方法，如下：

use SplFileInfo;public function showPDF()
{获取文件的对象$fileObj = new SplFileInfo(storage_path('app/uploadfiles/TestPDF.pdf'));获取文件的完整路径$path = $fileObj->getPathname();获取文件类型的后缀名$fileType = $fileObj->getExtension();switch ($fileType) {case 'docx':$contentType = 'application/vnd.openxmlformats-officedocument.wordprocessingml.document';break;case 'xlsx':$contentType = 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet';break;case 'txt':$contentType = 'text/plain';break;case 'pdf':$contentType = 'application/pdf';break;default:$contentType = 'application/pdf';break;}$headers = ['Content-Type' => $contentType,'Content-Disposition' => 'inline; filename = '.$fileObj->getFilename(),];return response()->file($path, $headers);
}注：'Content-Disposition' => 'inline' 代表在浏览器页面展示'Content-Disposition' => 'attachment' 代表在浏览器页面下载

上面显示 PDF 的方式是整个浏览器显示 PDF 内容，如果你想在页面中局部嵌入 PDF 显示，可以直接在视图文件里添加，如下代码：

显示 PDF ,如浏览器不支持嵌入显示，会显示下载信息<object data="{{ asset('myuploadfiles/TestPDF.pdf') }}" type="application/pdf" width="100%" height="800px"><p>您的浏览器不支持嵌入式 PDF 文件，请<a href="{{ asset('myuploadfiles/TestPDF.pdf') }}">下载</a>该文件以查看它。</p></object>如想显示 txt 文件，可以按照如下方式来处理<iframe src="{{ asset('myuploadfiles/AAA.txt') }}" width="100%" height="800px"><p>您的浏览器不支持嵌入式 PDF 文件，请<a href="{{ asset('myuploadfiles/AAA.txt') }}">下载</a>该文件以查看它。</p>
</iframe>注：
这里的 asset() 方法都是依赖软链接指定到真实的文件目录
myuploadfiles 为我定义的软链接，指向的是 storage/app/uploadfiles/ 目录
AAA.txt 为指定的 PDF 文件

如今我们已经学会如何展示文件了，那现在我们继续完善一下上面的例子，在页面的文件列表后面 添加一个 Check Online 的功能，点击后会在浏览器开启一个新的 tab 页来展示文件的内容，我们先创建一个新的视图文件，名为 showfile.blade.php，此文件用于在跳转后展示文件的内容，如下图：

<!doctype html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><!-- CSRF Token --><meta name="csrf-token" content="{{ csrf_token() }}"><title>Files Management</title><!-- Scripts --><script src="{{ asset('js/app.js') }}" defer></script><!-- Fonts --><link rel="dns-prefetch" href="//fonts.gstatic.com"><link href="https://fonts.googleapis.com/css?family=Nunito" rel="stylesheet"><!-- Styles --><link href="{{ asset('css/app.css') }}" rel="stylesheet">
</head>
<body><div id="app"><nav class="navbar navbar-expand-md navbar-light bg-white shadow-sm"><div style="padding-left: 10px;"> {{ $filename }} </div></nav><main class="py-4"><div class="container"><div class="row justify-content-center"><div class="col-md-10"><div class="card"><div class="card-header" style="text-align: center;">Show File</div><div class="card-body">@if ($filetype == 'txt')<div class="row mb-3"><iframe src="{{ asset('myuploadfiles/'.$filename) }}" width="100%" height="800px"><p>您的浏览器不支持嵌入式 TXT 文件</p></iframe></div>@else<div class="row mb-3"><object data="{{ asset('myuploadfiles/'.$filename) }}" type="{{ $contenttype }}" width="100%" height="800px"><p>您的浏览器不支持嵌入式 {{ $filetype }} 文件</p></object></div>@endif</div></div></div></div></div></main></div>
</body>
</html>

我们在控制器里创建一个名为 showFile() 的方法，用于给这个页面传递所需要的参数，如下图：

use SplFileInfo;public function getContentType($fileType)
{$contentType = "";switch ($fileType) {case 'docx':$contentType = 'application/vnd.openxmlformats-officedocument.wordprocessingml.document';break;case 'xlsx':$contentType = 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet';break;case 'txt':$contentType = 'text/plain';break;case 'pdf':$contentType = 'application/pdf';break;default:$contentType = 'application/pdf';break;}return $contentType;
}public function showFile($fileName)
{$fileObj = new SplFileInfo(storage_path('app/uploadfiles/'.$fileName));$fileName = $fileObj->getFilename();$fileType = $fileObj->getExtension();$contentType = $this->getContentType($fileType); // 自定义的一个获取 content type 的方法return view('files.showfile', ['filename' => $fileName, 'filetype' => $fileType,'contenttype' => $contentType]);
}

然后我们配置一个路由来搭建视图文件和控制器的沟通桥梁，如下图：

Route::get('/showfile/{filename}', [App\Http\Controllers\TryDemo\FilesManagementController::class, 'showFile'])->name('ShowFile');

最后我们在 filemanagement.blade.php 的视图文件添加一个超链接来调用这个名为 ShowFile 的路由，如下图：

<div class="d-flex justify-content-end"><a href="{{ route('DownloadFile', ['filename' => $fileObj->getFilename()]) }}"> Download </a><!-- 添加在此 ↓↓↓ --><a href="{{ route('ShowFile', ['filename' => $fileObj->getFilename()]) }}" target="_blank" class="mx-3"> Check Online </a><!-- 添加结束 -->
</div>

至此所有功能已完善，打开浏览器看效果，如下：


http://chatgpt.dhexx.cn/article/UFMtY12v.shtml

相关文章

安装laravel

安装laravel

安装laravel之前首先应该设置好安装好php&#xff0c;配置好环境变量。之后安装好compser。 1、安装php环境变量。 我使用的php环境安装包是upupw&#xff0c;&#xff08;php环境安装包有很多&#xff0c;例如phpstudy&#xff0c;wamp等等&#xff0c;读者可自行百度。&…
阅读更多...
Laravel框架 -- 文件下载功能

Laravel框架 -- 文件下载功能

Laravel 文件下载功能&#xff0c;通过手册&#xff0c;我们可以发现&#xff0c;Response的download方法就是我们所需要的文件下载功能的重要元素。 首先&#xff0c;我们注意一下&#xff0c;上面的方法中有两种写法&#xff0c;那么我以第二种为例子&#xff0c;解释一下实际…
阅读更多...
laravel安装

laravel安装

文章目录 前言一、下载composer二、安装composercmd 输入composer 检验 三、配置镜像第一步第二步 四、虚拟目录配置 前言 前提&#xff1a;安装了phpStudy套件。https://www.xp.cn/download.html 一、下载composer 从laravel5.x 开始 , 官网https://getcomposer.org/Compose…
阅读更多...
laravel文件上传与下载

laravel文件上传与下载

https://github.com/Chumper/Zippergithub地址 composer require chumper/zipper看到这个代表安装成功 代表路由 . . . // package chumper/zipper Route::get(zip, ZipControllerindex)->name(zip.index); Route::post(zip/download, ZipControllerdownload)->name(zi…
阅读更多...
Laravel 5.7下载、安装

Laravel 5.7下载、安装

本地安装laravel&#xff0c;php环境要配置好&#xff0c;推荐xmapp一键搭建。 1、程序包直接从官方下载&#xff0c;官方开源地址:https://github.com/laravel/laravel(当然也可从此网站&#xff1a;http://www.golaravel.com/download/ 下载一键安装包&#xff0c;下载下来就…
阅读更多...
【laravel】laravel的下载安装

【laravel】laravel的下载安装

下载 Laravel Laravel 利用 Composer&#xff08;Composer 中文&#xff09;来管理其自身的依赖包。因此&#xff0c;在使用 Laravel 之前&#xff0c;请务必确保在你的机器上已经安装了 Composer 。 上面是laravel中文对于如何安装使用laravel的官方解释&#xff0c;不同于大多…
阅读更多...
IE浏览器不能访问其他浏览器能正常访问

IE浏览器不能访问其他浏览器能正常访问

IE浏览器不能访问 而其他浏览器能正常访问 解决方法 -重置 1 win x 键&#xff0c;然后点击 windows powerShell &#xff08;以管理员方式运行&#xff09; 2 输入下面2条命令&#xff0c;记得回车 Netsh winsock resetnetsh advfirewall reset如下图所示&#xff1a; 运行…
阅读更多...
浏览器访问Linux的Tomcat

浏览器访问Linux的Tomcat

浏览器访问Linux的Tomcat 1、在Linux下启动tomcat服务器 2、打开防火墙&#xff0c;开放8080端口
阅读更多...
浏览器访问网页流程

浏览器访问网页流程

从我们输入URL并按下回车键到看到网页结果之间发生了什么&#xff1f;换句话说&#xff0c;一张网页&#xff0c;要经历怎样的过程&#xff0c;才能抵达用户面前&#xff1f;下面来从一些细节上面尝试一下探寻里面的秘密。 前言&#xff1a;键盘与硬件中断 说到输入URL&#…
阅读更多...
浏览器HTTPS访问问题

浏览器HTTPS访问问题

1、问题描述 搭建了HTTPS服务环境 https://172.16.0.17 &#xff0c;用浏览器访问时&#xff0c;出现提示信息&#xff1a; “您的连接不是私密连接”&#xff08;Chrome&#xff09;&#xff0c;如下图所示 “您的链接并不安全”&#xff08;Firefox&#xff09;&#xff0…
阅读更多...
win10如何通过局域网从浏览器访问ip

win10如何通过局域网从浏览器访问ip

1.打开控制面板&#xff0c;找到windows防火墙&#xff0c;找到高级设置&#xff0c;点击 点击公用配置文件下面的 Windows Defender 防火墙属性 3.修改预配置文件、专用配置文件、公用配置文件的入站连接&#xff0c;更改为运行 4.如下显示全是允许&#xff0c;就可以局域…
阅读更多...
如何在Chrome、IE里访问国密网站

如何在Chrome、IE里访问国密网站

随着国密网站的增多&#xff0c;很多常用浏览器不支持国密SSL网站访问的问题日益突出&#xff0c;如Chrome 、Edge、IE 等浏览器均不能访问国密SSL网站。而很多政府、银行、科研机构仍然运行着面向IE开发的应用&#xff0c;同时这些应用需要依赖 ActiveX 插件来完成特定的操作。…
阅读更多...
计算机无法访问浏览器时的查验方法

计算机无法访问浏览器时的查验方法

[TOC]计算机无法访问浏览器时的查验方法&#xff08;“科学上网”后遗症&#xff0c;直接看最后面&#xff09; 计算机网络故障排除一般采用“自底向上”的方式 我们知道&#xff0c;OSI参考模型中低层是为其上层提供服务的&#xff0c;因此一般进行网络故障排查也是由底层到…
阅读更多...
curl能访问但是浏览器不能访问

curl能访问但是浏览器不能访问

在Virtual Machines中安装centos7&#xff0c;centos7中运行docker docker运行两个nginx容器&#xff0c;开放8001,8002端口 查看防火墙状态 查看开放端口 curl可以访问 浏览器不能访问&#xff01; 问题解决&#xff1a; 浏览器设置了代理&#xff01; 浏览器设置了代理&a…
阅读更多...
浏览器访问web服务器经过了哪些过程

浏览器访问web服务器经过了哪些过程

文章目录 一、URL输入二、DNS解析三、建立TCP连接四、发送HTTP/HTTPS请求五、服务器响应请求六、浏览器解析渲染页面七、HTTP请求结束&#xff0c;断开TCP连接八、总结 一、URL输入 输入URL URL&#xff0c;全称叫做统一资源定位符&#xff0c;用于定位互联网上的资源&#xf…
阅读更多...
浏览器访问服务器的过程

浏览器访问服务器的过程

1、在浏览器地址栏中输入网址 2、浏览器通过用户在地址栏中输入的URL构造HTTP请求报文&#xff08;请求报文一般没有请求体&#xff09; 3、浏览器发起 DNS 解析请求&#xff0c;将域名转换为 IP 地址 4、浏览器将请求报文发送给服务器 5、服务器接收请求报文&#xff0c;并解…
阅读更多...
浏览器中网址访问过程详解

浏览器中网址访问过程详解

前言 当我们在浏览器中输入一个网址，比如www.google.cn，浏览器就会加载出百度的主页。那么浏览器背后完成的具体是怎么样的呢？ 总结起来大概的流程是这样的： （1）浏览器本身是一个客户端，当你输入URL的时候，首先浏览器会去请求DNS服务器，通过DNS获取相应的域名对应的…
阅读更多...
浏览器访问IPv6地址

浏览器访问IPv6地址

以本地的ipv6为例&#xff1a; 环境&#xff1a;win10、tomcat服务器 注&#xff1a;这里的tomcat服务器是用来帮助测试本地的ipv6地址可用性&#xff0c;如果是外网的的ipv6&#xff0c;直接访问即可 步骤如下&#xff1a; 一、首先查看本机的ipv6地址&#xff0c;在cmd命令…
阅读更多...
浏览器访问网站

浏览器访问网站

这个仅仅是我个人对于访问网站流程的一个理解&#xff0c;我相信肯定有不全面也有错漏的地方&#xff0c;如果是的各位可以给我指出来让我可以有所提高~ 五层协议体系结构中各层运用到的协议&#xff1a; 应用层&#xff1a;HTTP、DNS&#xff1b; 传输层&#xff1a;TCP、…
阅读更多...
Selenium模拟浏览器访问

Selenium模拟浏览器访问

目录 一、selenium简介 1.1、什么是selenium 1.2、为什么使用selenium 1.3、安装selenium 1.3.1、谷歌浏览器驱动下载 1.3.2、谷歌驱动和谷歌浏览器版本之间的映射表 1.3.3、查看谷歌浏览器版本 1.3.4、安装selenium库 二、selenium的使用 2.1、selenium的使用步骤 2.2、举例…
阅读更多...
推荐文章

Copyright @ 2022~2023