作者：温新

时间：2021-07-26

hi，我是温新，一名PHPer

此篇文章使用Laravel8.x上传文件（图片）到七年牛。之前是有记录过基于另外一个第三方扩展包的用法，详情可以参考 Laravel6.x上传图片到七牛云 这篇文章。

Laravel8.x将使用overtrue/laravel-filesystem-qiniu这个扩展来记录上传图片到七牛云。从github来看，这个包很长时间没有更新。我是基于Laravel8.x来使用，目前没有发现问题。

准备工作

1）准备好七牛云账号；

2）购买好对象存储服务；

3）创建对象窗口空间；

4）域名绑定，也可以使用临时提供的。我创建的是域名绑定，访问图片时，路径将会是使用我的域名。

安装overtrue/laravel-filesystem-qinniu

第一步：安装

$ composer require "overtrue/laravel-filesystem-qiniu"

第二步：配置

文件位置：config/app.php

<span style="box-sizing: border-box;padding-right: 0.1px"><span style="box-sizing: border-box;color: rgb(170, 17, 17)">'providers'</span> <span style="box-sizing: border-box;color: rgb(152, 26, 26)">=></span> [</span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">    <span style="box-sizing: border-box;color: rgb(170, 85, 0)">// Other service providers...</span></span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">    <span style="box-sizing: border-box;color: rgb(0, 0, 0)">Overtrue\LaravelFilesystem\Qiniu\QiniuStorageServiceProvider</span>::<span style="box-sizing: border-box;color: rgb(119, 0, 136)">class</span>,</span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">],</span>

文件位置：config/filesystems.php

<span style="box-sizing: border-box;padding-right: 0.1px"><span style="box-sizing: border-box;color: rgb(152, 26, 26)"><?</span><span style="box-sizing: border-box;color: rgb(0, 0, 0)">php</span></span><br></br><span style="box-sizing: border-box;padding-right: 0.1px"><span style="box-sizing: border-box"></span></span><br></br><span style="box-sizing: border-box;padding-right: 0.1px"><span style="box-sizing: border-box;color: rgb(119, 0, 136)">return</span> [</span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">   <span style="box-sizing: border-box;color: rgb(170, 17, 17)">'disks'</span> <span style="box-sizing: border-box;color: rgb(152, 26, 26)">=></span> [</span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">        <span style="box-sizing: border-box;color: rgb(170, 85, 0)">//...</span></span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">        <span style="box-sizing: border-box;color: rgb(170, 17, 17)">'qiniu'</span> <span style="box-sizing: border-box;color: rgb(152, 26, 26)">=></span> [</span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">           <span style="box-sizing: border-box;color: rgb(170, 17, 17)">'driver'</span>     <span style="box-sizing: border-box;color: rgb(152, 26, 26)">=></span> <span style="box-sizing: border-box;color: rgb(170, 17, 17)">'qiniu'</span>,</span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">           <span style="box-sizing: border-box;color: rgb(170, 17, 17)">'access_key'</span> <span style="box-sizing: border-box;color: rgb(152, 26, 26)">=></span> <span style="box-sizing: border-box;color: rgb(0, 0, 0)">env</span>(<span style="box-sizing: border-box;color: rgb(170, 17, 17)">'QINIU_ACCESS_KEY'</span>, <span style="box-sizing: border-box;color: rgb(170, 17, 17)">'xxxxxxxxxxxxxxxx'</span>),</span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">           <span style="box-sizing: border-box;color: rgb(170, 17, 17)">'secret_key'</span> <span style="box-sizing: border-box;color: rgb(152, 26, 26)">=></span> <span style="box-sizing: border-box;color: rgb(0, 0, 0)">env</span>(<span style="box-sizing: border-box;color: rgb(170, 17, 17)">'QINIU_SECRET_KEY'</span>, <span style="box-sizing: border-box;color: rgb(170, 17, 17)">'xxxxxxxxxxxxxxxx'</span>),</span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">           <span style="box-sizing: border-box;color: rgb(170, 17, 17)">'bucket'</span>     <span style="box-sizing: border-box;color: rgb(152, 26, 26)">=></span> <span style="box-sizing: border-box;color: rgb(0, 0, 0)">env</span>(<span style="box-sizing: border-box;color: rgb(170, 17, 17)">'QINIU_BUCKET'</span>, <span style="box-sizing: border-box;color: rgb(170, 17, 17)">'test'</span>),</span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">           <span style="box-sizing: border-box;color: rgb(170, 17, 17)">'domain'</span>     <span style="box-sizing: border-box;color: rgb(152, 26, 26)">=></span> <span style="box-sizing: border-box;color: rgb(0, 0, 0)">env</span>(<span style="box-sizing: border-box;color: rgb(170, 17, 17)">'QINIU_DOMAIN'</span>, <span style="box-sizing: border-box;color: rgb(170, 17, 17)">'xxx.clouddn.com'</span>), <span style="box-sizing: border-box;color: rgb(170, 85, 0)">// or host: https://xxxx.clouddn.com</span></span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">        ],</span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">        <span style="box-sizing: border-box;color: rgb(170, 85, 0)">//...</span></span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">    ]</span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">];</span>

上传图片到七牛云

注意：这一步我是在项目中操作的，因此本地并未实际测试，但操作都是一样的。

第一步：配置七牛云信息

文件：env

<span style="box-sizing: border-box;padding-right: 0.1px"><span style="box-sizing: border-box;color: rgb(0, 0, 0)">QINIU_ACCESS_KEY</span><span style="box-sizing: border-box;color: rgb(152, 26, 26)">=</span><span style="box-sizing: border-box;color: rgb(51, 0, 170)">key</span></span><br></br><span style="box-sizing: border-box;padding-right: 0.1px"><span style="box-sizing: border-box;color: rgb(0, 0, 0)">QINIU_SECRET_KEY</span><span style="box-sizing: border-box;color: rgb(152, 26, 26)">=</span><span style="box-sizing: border-box;color: rgb(0, 0, 0)">secket</span></span><br></br><span style="box-sizing: border-box;padding-right: 0.1px"><span style="box-sizing: border-box;color: rgb(0, 0, 0)">QINIU_BUCKET</span><span style="box-sizing: border-box;color: rgb(152, 26, 26)">=</span><span style="box-sizing: border-box;color: rgb(0, 0, 0)">七牛对象存空间名</span></span><br></br><span style="box-sizing: border-box;padding-right: 0.1px"><span style="box-sizing: border-box;color: rgb(170, 85, 0)"># 注意，必须携带 http://或https://</span></span><br></br><span style="box-sizing: border-box;padding-right: 0.1px"><span style="box-sizing: border-box;color: rgb(0, 0, 0)">QINIU_DOMAIN</span><span style="box-sizing: border-box;color: rgb(152, 26, 26)">=</span><span style="box-sizing: border-box;color: rgb(0, 0, 0)">https</span>:<span style="box-sizing: border-box;color: rgb(170, 85, 0)">//www.ziruchu.com</span></span>

第二步：配置路由

文件位置：routes/web.php

Route::post('art/upload','ArticleController@upload');

第三步：控制器方法

<span style="box-sizing: border-box;padding-right: 0.1px"><span style="box-sizing: border-box;color: rgb(119, 0, 136)">use</span> <span style="box-sizing: border-box;color: rgb(0, 0, 0)">Illuminate\Support\Facades\Storage</span>;</span><br></br><span style="box-sizing: border-box;padding-right: 0.1px"><span style="box-sizing: border-box"></span></span><br></br><span style="box-sizing: border-box;padding-right: 0.1px"><span style="box-sizing: border-box;color: rgb(170, 85, 0)">// 图片上传</span></span><br></br><span style="box-sizing: border-box;padding-right: 0.1px"><span style="box-sizing: border-box;color: rgb(119, 0, 136)">public</span> <span style="box-sizing: border-box;color: rgb(119, 0, 136)">function</span> <span style="box-sizing: border-box;color: rgb(0, 0, 255)">upload</span>(<span style="box-sizing: border-box;color: rgb(0, 0, 0)">Request</span> <span style="box-sizing: border-box;color: rgb(0, 85, 170)">$request</span>)</span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">{</span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">    <span style="box-sizing: border-box;color: rgb(119, 0, 136)">if</span> (<span style="box-sizing: border-box;color: rgb(0, 85, 170)">$request</span><span style="box-sizing: border-box;color: rgb(152, 26, 26)">-></span><span style="box-sizing: border-box;color: rgb(0, 0, 0)">isMethod</span>(<span style="box-sizing: border-box;color: rgb(170, 17, 17)">'POST'</span>)) {</span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">        <span style="box-sizing: border-box;color: rgb(170, 85, 0)">// 判断有文件上传且文件上传成功</span></span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">        <span style="box-sizing: border-box;color: rgb(119, 0, 136)">if</span> (<span style="box-sizing: border-box;color: rgb(0, 85, 170)">$request</span><span style="box-sizing: border-box;color: rgb(152, 26, 26)">-></span><span style="box-sizing: border-box;color: rgb(0, 0, 0)">hasFile</span>(<span style="box-sizing: border-box;color: rgb(170, 17, 17)">'file'</span>) <span style="box-sizing: border-box;color: rgb(152, 26, 26)">&&</span> <span style="box-sizing: border-box;color: rgb(0, 85, 170)">$request</span><span style="box-sizing: border-box;color: rgb(152, 26, 26)">-></span><span style="box-sizing: border-box;color: rgb(51, 0, 170)">file</span>(<span style="box-sizing: border-box;color: rgb(170, 17, 17)">'file'</span>)<span style="box-sizing: border-box;color: rgb(152, 26, 26)">-></span><span style="box-sizing: border-box;color: rgb(0, 0, 0)">isValid</span>()) {</span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">            <span style="box-sizing: border-box;color: rgb(170, 85, 0)">// 获取上传文件</span></span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">            <span style="box-sizing: border-box;color: rgb(0, 85, 170)">$file</span> <span style="box-sizing: border-box;color: rgb(152, 26, 26)">=</span> <span style="box-sizing: border-box;color: rgb(0, 85, 170)">$request</span><span style="box-sizing: border-box;color: rgb(152, 26, 26)">-></span><span style="box-sizing: border-box;color: rgb(51, 0, 170)">file</span>(<span style="box-sizing: border-box;color: rgb(170, 17, 17)">'file'</span>);</span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">            <span style="box-sizing: border-box;color: rgb(170, 85, 0)">// 获取文件后缀</span></span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">            <span style="box-sizing: border-box;color: rgb(0, 85, 170)">$ext</span>  <span style="box-sizing: border-box;color: rgb(152, 26, 26)">=</span> <span style="box-sizing: border-box;color: rgb(0, 85, 170)">$file</span><span style="box-sizing: border-box;color: rgb(152, 26, 26)">-></span><span style="box-sizing: border-box;color: rgb(0, 0, 0)">getClientOriginalExtension</span>();</span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">            <span style="box-sizing: border-box;color: rgb(170, 85, 0)">// 获取上传文件大小</span></span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">            <span style="box-sizing: border-box;color: rgb(0, 85, 170)">$size</span> <span style="box-sizing: border-box;color: rgb(152, 26, 26)">=</span> <span style="box-sizing: border-box;color: rgb(0, 85, 170)">$file</span><span style="box-sizing: border-box;color: rgb(152, 26, 26)">-></span><span style="box-sizing: border-box;color: rgb(0, 0, 0)">getSize</span>();</span><br></br><span style="box-sizing: border-box;padding-right: 0.1px"><span style="box-sizing: border-box"></span></span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">            <span style="box-sizing: border-box;color: rgb(170, 85, 0)">// 允许文件上传格式</span></span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">            <span style="box-sizing: border-box;color: rgb(0, 85, 170)">$allowExt</span>    <span style="box-sizing: border-box;color: rgb(152, 26, 26)">=</span> [<span style="box-sizing: border-box;color: rgb(170, 17, 17)">'jpg'</span>,<span style="box-sizing: border-box;color: rgb(170, 17, 17)">'jpeg'</span>,<span style="box-sizing: border-box;color: rgb(170, 17, 17)">'gif'</span>,<span style="box-sizing: border-box;color: rgb(170, 17, 17)">'png'</span>];</span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">            <span style="box-sizing: border-box;color: rgb(170, 85, 0)">// 允许文件上传大小</span></span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">            <span style="box-sizing: border-box;color: rgb(0, 85, 170)">$allowSize</span>   <span style="box-sizing: border-box;color: rgb(152, 26, 26)">=</span> <span style="box-sizing: border-box;color: rgb(17, 102, 68)">1024</span> <span style="box-sizing: border-box;color: rgb(152, 26, 26)">*</span> <span style="box-sizing: border-box;color: rgb(17, 102, 68)">1024</span>;</span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">            <span style="box-sizing: border-box;color: rgb(170, 85, 0)">// 新文件名</span></span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">            <span style="box-sizing: border-box;color: rgb(0, 85, 170)">$newFileName</span> <span style="box-sizing: border-box;color: rgb(152, 26, 26)">=</span> <span style="box-sizing: border-box;color: rgb(51, 0, 170)">date</span>(<span style="box-sizing: border-box;color: rgb(170, 17, 17)">'Ymd'</span>) . <span style="box-sizing: border-box;color: rgb(51, 0, 170)">rand</span>(<span style="box-sizing: border-box;color: rgb(17, 102, 68)">100000</span>, <span style="box-sizing: border-box;color: rgb(17, 102, 68)">999999</span>) . <span style="box-sizing: border-box;color: rgb(170, 17, 17)">'.'</span> . <span style="box-sizing: border-box;color: rgb(0, 85, 170)">$ext</span>;</span><br></br><span style="box-sizing: border-box;padding-right: 0.1px"><span style="box-sizing: border-box"></span></span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">            <span style="box-sizing: border-box;color: rgb(119, 0, 136)">if</span> (<span style="box-sizing: border-box;color: rgb(152, 26, 26)">!</span><span style="box-sizing: border-box;color: rgb(51, 0, 170)">in_array</span>(<span style="box-sizing: border-box;color: rgb(0, 85, 170)">$ext</span>, <span style="box-sizing: border-box;color: rgb(0, 85, 170)">$allowExt</span>)) {</span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">                <span style="box-sizing: border-box;color: rgb(119, 0, 136)">return</span> [<span style="box-sizing: border-box;color: rgb(170, 17, 17)">'code'</span> <span style="box-sizing: border-box;color: rgb(152, 26, 26)">=></span> <span style="box-sizing: border-box;color: rgb(17, 102, 68)">400</span>, <span style="box-sizing: border-box;color: rgb(170, 17, 17)">'msg'</span> <span style="box-sizing: border-box;color: rgb(152, 26, 26)">=></span> <span style="box-sizing: border-box;color: rgb(170, 17, 17)">'非法文件上传'</span>];</span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">            }</span><br></br><span style="box-sizing: border-box;padding-right: 0.1px"><span style="box-sizing: border-box"></span></span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">            <span style="box-sizing: border-box;color: rgb(119, 0, 136)">if</span> (<span style="box-sizing: border-box;color: rgb(0, 85, 170)">$size</span> <span style="box-sizing: border-box;color: rgb(152, 26, 26)">></span> <span style="box-sizing: border-box;color: rgb(0, 85, 170)">$allowSize</span>) {</span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">                <span style="box-sizing: border-box;color: rgb(119, 0, 136)">return</span> [<span style="box-sizing: border-box;color: rgb(170, 17, 17)">'code'</span> <span style="box-sizing: border-box;color: rgb(152, 26, 26)">=></span> <span style="box-sizing: border-box;color: rgb(17, 102, 68)">401</span>, <span style="box-sizing: border-box;color: rgb(170, 17, 17)">'msg'</span> <span style="box-sizing: border-box;color: rgb(152, 26, 26)">=></span> <span style="box-sizing: border-box;color: rgb(170, 17, 17)">'上传文件过大'</span>];</span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">            }</span><br></br><span style="box-sizing: border-box;padding-right: 0.1px"><span style="box-sizing: border-box"></span></span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">            <span style="box-sizing: border-box;color: rgb(170, 85, 0)">// 将图片上传到七牛云</span></span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">            <span style="box-sizing: border-box;color: rgb(0, 85, 170)">$result</span> <span style="box-sizing: border-box;color: rgb(152, 26, 26)">=</span> <span style="box-sizing: border-box;color: rgb(0, 0, 0)">Storage</span>::<span style="box-sizing: border-box;color: rgb(0, 0, 0)">disk</span>(<span style="box-sizing: border-box;color: rgb(170, 17, 17)">'qiniu'</span>)<span style="box-sizing: border-box;color: rgb(152, 26, 26)">-></span><span style="box-sizing: border-box;color: rgb(0, 0, 0)">writeStream</span>(<span style="box-sizing: border-box;color: rgb(0, 85, 170)">$newFileName</span>,<span style="box-sizing: border-box;color: rgb(51, 0, 170)">fopen</span>(<span style="box-sizing: border-box;color: rgb(0, 85, 170)">$file</span><span style="box-sizing: border-box;color: rgb(152, 26, 26)">-></span><span style="box-sizing: border-box;color: rgb(0, 0, 0)">getRealPath</span>(),<span style="box-sizing: border-box;color: rgb(170, 17, 17)">'r'</span>));</span><br></br><span style="box-sizing: border-box;padding-right: 0.1px"><span style="box-sizing: border-box"></span></span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">            <span style="box-sizing: border-box;color: rgb(119, 0, 136)">if</span> (<span style="box-sizing: border-box;color: rgb(0, 85, 170)">$result</span>) {</span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">                <span style="box-sizing: border-box;color: rgb(119, 0, 136)">return</span> [<span style="box-sizing: border-box;color: rgb(170, 17, 17)">'code'</span> <span style="box-sizing: border-box;color: rgb(152, 26, 26)">=></span> <span style="box-sizing: border-box;color: rgb(17, 102, 68)">200</span>, <span style="box-sizing: border-box;color: rgb(170, 17, 17)">'msg'</span> <span style="box-sizing: border-box;color: rgb(152, 26, 26)">=></span> <span style="box-sizing: border-box;color: rgb(170, 17, 17)">'文件上传成功'</span>, <span style="box-sizing: border-box;color: rgb(170, 17, 17)">'filePath'</span> <span style="box-sizing: border-box;color: rgb(152, 26, 26)">=></span> <span style="box-sizing: border-box;color: rgb(0, 85, 170)">$newFileName</span>];</span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">            }</span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">        }</span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">    }</span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">}</span>

这段上传代码会很熟悉，Laravel学习笔记基础系列--(十一)Laravel上传文件 这篇文章就是，几乎可以直接拿来就用。

第四步：前端界面使用

文件：edit.blade.php

<span style="box-sizing: border-box;padding-right: 0.1px"><span style="box-sizing: border-box;color: rgb(152, 26, 26)"><</span><span style="box-sizing: border-box;color: rgb(0, 0, 0)">div</span> <span style="box-sizing: border-box;color: rgb(119, 0, 136)">class</span><span style="box-sizing: border-box;color: rgb(152, 26, 26)">=</span><span style="box-sizing: border-box;color: rgb(170, 17, 17)">"layui-upload-list"</span><span style="box-sizing: border-box;color: rgb(152, 26, 26)">></span></span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">    <span style="box-sizing: border-box;color: rgb(152, 26, 26)"><</span><span style="box-sizing: border-box;color: rgb(0, 0, 0)">img</span> <span style="box-sizing: border-box;color: rgb(119, 0, 136)">class</span><span style="box-sizing: border-box;color: rgb(152, 26, 26)">=</span><span style="box-sizing: border-box;color: rgb(170, 17, 17)">"layui-upload-img"</span> <span style="box-sizing: border-box;color: rgb(0, 0, 0)">src</span><span style="box-sizing: border-box;color: rgb(152, 26, 26)">=</span><span style="box-sizing: border-box;color: rgb(170, 17, 17)">"{{env('QINIU_DOMAIN') . '/'.</span><span style="box-sizing: border-box;color: rgb(0, 85, 170)">$art</span>-><span style="box-sizing: border-box;color: rgb(0, 0, 0)">thumb</span><span style="box-sizing: border-box;color: rgb(170, 17, 17)">}}"</span> <span style="box-sizing: border-box;color: rgb(0, 0, 0)">id</span><span style="box-sizing: border-box;color: rgb(152, 26, 26)">=</span><span style="box-sizing: border-box;color: rgb(170, 17, 17)">"demo1"</span><span style="box-sizing: border-box;color: rgb(152, 26, 26)">></span></span><br></br><span style="box-sizing: border-box;padding-right: 0.1px">    <span style="box-sizing: border-box;color: rgb(152, 26, 26)"><</span><span style="box-sizing: border-box;color: rgb(0, 0, 0)">p</span> <span style="box-sizing: border-box;color: rgb(0, 0, 0)">id</span><span style="box-sizing: border-box;color: rgb(152, 26, 26)">=</span><span style="box-sizing: border-box;color: rgb(170, 17, 17)">"demoText"</span><span style="box-sizing: border-box;color: rgb(152, 26, 26)">></</span><span style="box-sizing: border-box;color: rgb(0, 0, 0)">p</span><span style="box-sizing: border-box;color: rgb(152, 26, 26)">></span></span><br></br><span style="box-sizing: border-box;padding-right: 0.1px"><span style="box-sizing: border-box;color: rgb(152, 26, 26)"></</span><span style="box-sizing: border-box;color: rgb(0, 0, 0)">div</span><span style="box-sizing: border-box;color: rgb(152, 26, 26)">></span></span>

基础操作到这里就结束了。以后要用到了，直接过来拿，岂不是很方便！

我是温新

每天进步一点点，就一点点