更改DcatAdmin上传组件, 直传七牛云

Dcat 文件上传文档

由于dcat文件上传是先传到服务器再转发到七牛云的, 所以会在进度条走完之后还要等待一段时间, 使用体验不好, 且容易超时

琢磨了好久, 贴出来分享一下

// 随机文件名
$filename = md5(uniqid()) . '.mp4';
$disk     = Storage::disk('qiniu');
// 回调信息, Dcat 上传文件需要的报文格式
$callBack = [
    'status' => true,
    'data'   => [
        'id'   => $filename,
        'name' => $filename,
        'path' => $filename,
        'url'  => 'http://' . env('QINIU_DOMAINS') . '/' . $filename,
    ],
];
$policy   = [
    'returnBody' => json_encode($callBack),
];
// 七牛云上传 token
$token    = $disk->uploadToken($filename, 3600, $policy);

$form->file('video1', '上传视频')
    // 更改储存驱动
    ->disk('qiniu')
    // 自动上传
    ->autoUpload()
    // 限制文件上传格式
    ->accept('mp4')
    // 提示文字
    ->help('仅支持MP4格式')
    // 更改文件最大限制
    ->maxSize(512000)
    // 关闭页面删除
    ->removable(false)
    // 设置上传地址
    ->url('http://upload-z2.qiniup.com')
    // 自定义 webuploader 配置
    // Dcat 默认 name 为 _file_
    ->options(['fileVal' => 'file'])
    // 上传事件
    ->on('startUpload', <<<JS
        function () {
            console.log('文件开始上传...', this);
            // 上传文件前附加自定义参数到文件上传接口
            this.uploader.options.formData['token'] = "$token";
            this.uploader.options.formData['fileName'] = "$filename";
            this.uploader.options.formData['key'] = "$filename";
        }
JS
    );
本作品采用《CC 协议》,转载必须注明作者和本文链接
海到无涯天作案,山登绝顶我为峰
《L04 微信小程序从零到发布》
从小程序个人账户申请开始,带你一步步进行开发一个微信小程序,直到提交微信控制台上线发布。
《G01 Go 实战入门》
从零开始带你一步步开发一个 Go 博客项目,让你在最短的时间内学会使用 Go 进行编码。项目结构很大程度上参考了 Laravel。
讨论数量: 3

支持分片上传吗

6个月前 评论
Slowlyo (楼主) 6个月前

讨论应以学习和精进为目的。请勿发布不友善或者负能量的内容,与人为善,比聪明更重要!