blackteay/ThinkAdmin
1
0
Fork 0
mirror of https://gitee.com/zoujingli/ThinkAdmin.git synced 2025-04-06 03:58:04 +08:00
Code Issues Projects Releases Wiki Activity

修改文件上传处理

Browse Source
This commit is contained in:
邹景立 2021-05-27 14:26:35 +08:00
parent bc5ca1126d
commit eb3be52849
3 changed files with 84 additions and 88 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
app/admin/controller/api/Upload.php
View File

@ -110,7 +110,6 @@ class Upload extends Controller
/** /**
* 文件上传入口 * 文件上传入口
* @login true * @login true
* @return Json
* @throws \think\db\exception\DataNotFoundException * @throws \think\db\exception\DataNotFoundException
* @throws \think\db\exception\DbException * @throws \think\db\exception\DbException
* @throws \think\db\exception\ModelNotFoundException * @throws \think\db\exception\ModelNotFoundException
@ -118,15 +117,15 @@ class Upload extends Controller
public function file(): Json public function file(): Json
{ {
if (!($file = $this->getFile())->isValid()) { if (!($file = $this->getFile())->isValid()) {
return json(['uploaded' => false, 'error' => ['message' => '文件上传异常，文件过大或未上传！']]); $this->error('文件上传异常，文件过大或未上传！');
} }
$extension = strtolower($file->getOriginalExtension()); $extension = strtolower($file->getOriginalExtension());
[$pathname, $original] = [$file->getPathname(), $file->getOriginalName()]; [$pathname, $original] = [$file->getPathname(), $file->getOriginalName()];
if (!in_array($extension, str2arr(sysconf('storage.allow_exts')))) { if (!in_array($extension, str2arr(sysconf('storage.allow_exts')))) {
return json(['uploaded' => false, 'error' => ['message' => '文件类型受限，请在后台配置规则！']]); $this->error('文件类型受限，请在后台配置规则！');
} }
if (in_array($extension, ['sh', 'asp', 'bat', 'cmd', 'exe', 'php'])) { if (in_array($extension, ['sh', 'asp', 'bat', 'cmd', 'exe', 'php'])) {
return json(['uploaded' => false, 'error' => ['message' => '文件安全保护，可执行文件禁止上传！']]); $this->error('文件安全保护，可执行文件禁止上传！');
} }
[$this->type, $this->safe] = [$this->getType(), $this->getSafe()]; [$this->type, $this->safe] = [$this->getType(), $this->getSafe()];
$this->name = input('key') ?: Storage::name($pathname, $extension, '', 'md5_file'); $this->name = input('key') ?: Storage::name($pathname, $extension, '', 'md5_file');
@ -138,26 +137,26 @@ class Upload extends Controller
$info = $local->info($this->name, $this->safe, $original); $info = $local->info($this->name, $this->safe, $original);
if (in_array($extension, ['jpg', 'gif', 'png', 'bmp', 'jpeg', 'wbmp'])) { if (in_array($extension, ['jpg', 'gif', 'png', 'bmp', 'jpeg', 'wbmp'])) {
if ($this->imgNotSafe($distname) && $local->del($this->name)) { if ($this->imgNotSafe($distname) && $local->del($this->name)) {
return json(['uploaded' => false, 'error' => ['message' => '图片未通过安全检查！']]); $this->error('图片未通过安全检查！');
} }
[$width, $height] = getimagesize($distname); [$width, $height] = getimagesize($distname);
if (($width < 1 || $height < 1) && $local->del($this->name)) { if (($width < 1 || $height < 1) && $local->del($this->name)) {
return json(['uploaded' => false, 'error' => ['message' => '读取图片的尺寸失败！']]); $this->error('读取图片的尺寸失败！');
} }
} }
} else { } else {
$bina = file_get_contents($pathname); $bina = file_get_contents($pathname);
$info = Storage::instance($this->type)->set($this->name, $bina, $this->safe, $original); $info = Storage::instance($this->type)->set($this->name, $bina, $this->safe, $original);
} }
if (isset($info['url'])) {
$this->success('文件上传成功！', ['url' => $this->safe ? $this->name : $info['url']]);
} else {
$this->error('文件处理失败，请稍候再试！');
}
} catch (HttpResponseException $exception) { } catch (HttpResponseException $exception) {
throw $exception; throw $exception;
} catch (\Exception $exception) { } catch (\Exception $exception) {
return json(['uploaded' => false, 'error' => ['message' => $exception->getMessage()]]); $this->error($exception->getMessage());
}
if (is_array($info) && isset($info['url'])) {
return json(['uploaded' => true, 'filename' => $this->name, 'url' => $this->safe ? $this->name : $info['url']]);
} else {
return json(['uploaded' => false, 'error' => ['message' => '文件处理失败，请稍候再试！']]);
} }
} }

126
app/admin/view/api/upload.js
View File

@ -1,59 +1,59 @@
define(['md5'], function (SparkMD5, allowMime) { define(['md5'], function (SparkMD5, allowMime) {
allowMime = JSON.parse('{$exts|raw}'); allowMime = JSON.parse('{$exts|raw}');
return function (element, callable, option) { return function (element, callable, completeCallable) {
/*! 初始化变量 */ /*! 初始化变量 */
option = {element: $(element), exts: [], mimes: [], files: {}, cache: {}, load: 0}; var opt = {element: $(element), exts: [], mimes: [], files: {}, cache: {}, load: 0};
option.count = {total: 0, uploaded: 0}, option.size = option.element.data('size') || 0; opt.count = {total: 0, uploaded: 0}, opt.size = opt.element.data('size') || 0;
option.safe = option.element.data('safe') ? 1 : 0, option.hload = option.element.data('hide-load') ? 1 : 0; opt.safe = opt.element.data('safe') ? 1 : 0, opt.hload = opt.element.data('hide-load') ? 1 : 0;
option.field = option.element.data('field') || 'file', option.input = $('[name="_field_"]'.replace('_field_', option.field)); opt.field = opt.element.data('field') || 'file', opt.input = $('input[name="' + opt.field + '"]:not([type=file])');
option.uptype = option.safe ? 'local' : option.element.attr('data-uptype') || '', option.multiple = option.element.data('multiple') > 0; opt.uptype = opt.safe ? 'local' : opt.element.attr('data-uptype') || '', opt.multiple = opt.element.data('multiple') > 0;
/*! 文件选择筛选 */ /*! 文件选择筛选 */
$((option.element.data('type') || '').split(',')).map(function (i, ext) { $((opt.element.data('type') || '').split(',')).map(function (i, ext) {
if (allowMime[ext]) option.exts.push(ext), option.mimes.push(allowMime[ext]); if (allowMime[ext]) opt.exts.push(ext), opt.mimes.push(allowMime[ext]);
}); });
/*! 初始化上传组件 */ /*! 初始化上传组件 */
option.uploader = layui.upload.render({ opt.uploader = layui.upload.render({
url: '{:url("admin/api.upload/file")}', url: '{:url("admin/api.upload/file")}',
auto: false, elem: element, accept: 'file', multiple: option.multiple, auto: false, elem: element, accept: 'file', multiple: opt.multiple,
exts: option.exts.join('|'), acceptMime: option.mimes.join(','), choose: function (object) { exts: opt.exts.join('|'), acceptMime: opt.mimes.join(','), choose: function (object) {
option.element.triggerHandler('upload.choose', option.files = object.pushFile()); opt.element.triggerHandler('upload.choose', opt.files = object.pushFile());
option.uploader.config.elem.next().val(''), layui.each(option.files, function (index, file) { opt.uploader.config.elem.next().val(''), layui.each(opt.files, function (index, file) {
if (option.size > 0 && file.size > option.size) { if (opt.size > 0 && file.size > opt.size) {
return delete option.files[index], $.msg.tips('文件大小超出上传限制！'); return delete opt.files[index], $.msg.tips('文件大小超出上传限制！');
} }
option.load = option.hload || $.msg.loading('上传进度 <span data-upload-progress>0%</span>'); opt.load = opt.hload || $.msg.loading('上传进度 <span data-upload-progress>0%</span>');
option.count.total++, file.index = index, option.cache[index] = file, delete option.files[index]; opt.count.total++, file.index = index, opt.cache[index] = file, delete opt.files[index];
md5file(file).then(function (file) { md5file(file).then(function (file) {
option.element.triggerHandler('upload.hash', file); opt.element.triggerHandler('upload.hash', file);
jQuery.ajax("{:url('admin/api.upload/state')}", { jQuery.ajax("{:url('admin/api.upload/state')}", {
data: {key: file.xkey, uptype: option.uptype, safe: option.safe, name: file.name}, method: 'post', success: function (ret) { data: {key: file.xkey, uptype: opt.uptype, safe: opt.safe, name: file.name}, method: 'post', success: function (ret) {
if (parseInt(ret.code) === 404) { if (parseInt(ret.code) === 404) {
file.xurl = ret.data.url; file.xurl = ret.data.url;
option.uploader.config.url = ret.data.server; opt.uploader.config.url = ret.data.server;
option.uploader.config.data.key = ret.data.key; opt.uploader.config.data.key = ret.data.key;
option.uploader.config.data.safe = ret.data.safe; opt.uploader.config.data.safe = ret.data.safe;
option.uploader.config.data.uptype = ret.data.uptype; opt.uploader.config.data.uptype = ret.data.uptype;
if (ret.data.uptype === 'qiniu') { if (ret.data.uptype === 'qiniu') {
option.uploader.config.data.token = ret.data.token; opt.uploader.config.data.token = ret.data.token;
} else if (ret.data.uptype === 'alioss') { } else if (ret.data.uptype === 'alioss') {
option.uploader.config.data['policy'] = ret.data.policy; opt.uploader.config.data['policy'] = ret.data.policy;
option.uploader.config.data['signature'] = ret.data.signature; opt.uploader.config.data['signature'] = ret.data.signature;
option.uploader.config.data['OSSAccessKeyId'] = ret.data.OSSAccessKeyId; opt.uploader.config.data['OSSAccessKeyId'] = ret.data.OSSAccessKeyId;
option.uploader.config.data['success_action_status'] = 200; opt.uploader.config.data['success_action_status'] = 200;
option.uploader.config.data['Content-Disposition'] = 'inline;filename=' + encodeURIComponent(file.name); opt.uploader.config.data['Content-Disposition'] = 'inline;filename=' + encodeURIComponent(file.name);
} else if (ret.data.uptype === 'txcos') { } else if (ret.data.uptype === 'txcos') {
option.uploader.config.data['q-ak'] = ret.data['q-ak']; opt.uploader.config.data['q-ak'] = ret.data['q-ak'];
option.uploader.config.data['policy'] = ret.data.policy; opt.uploader.config.data['policy'] = ret.data.policy;
option.uploader.config.data['q-key-time'] = ret.data['q-key-time']; opt.uploader.config.data['q-key-time'] = ret.data['q-key-time'];
option.uploader.config.data['q-signature'] = ret.data['q-signature']; opt.uploader.config.data['q-signature'] = ret.data['q-signature'];
option.uploader.config.data['q-sign-algorithm'] = ret.data['q-sign-algorithm']; opt.uploader.config.data['q-sign-algorithm'] = ret.data['q-sign-algorithm'];
option.uploader.config.data['success_action_status'] = 200; opt.uploader.config.data['success_action_status'] = 200;
option.uploader.config.data['Content-Disposition'] = 'inline;filename=' + encodeURIComponent(file.name); opt.uploader.config.data['Content-Disposition'] = 'inline;filename=' + encodeURIComponent(file.name);
} }
object.upload(file.index, file); object.upload(file.index, file);
} else if (parseInt(ret.code) === 200) { } else if (parseInt(ret.code) === 200) {
file.xurl = ret.data.url; file.xurl = ret.data.url;
option.uploader.config.done({uploaded: true, url: file.xurl}, file.index); opt.uploader.config.done({code: 1, url: file.xurl, info: '文件秒传成功！'}, file.index);
} else { } else {
$.msg.tips(ret.info || ret.error.message || '文件上传出错！'); $.msg.tips(ret.info || ret.error.message || '文件上传出错！');
} }
@ -63,32 +63,34 @@ define(['md5'], function (SparkMD5, allowMime) {
}); });
}, progress: function (number) { }, progress: function (number) {
$('[data-upload-progress]').html(number + '%'); $('[data-upload-progress]').html(number + '%');
option.element.triggerHandler('upload.progress', {number: number, event: arguments[2], file: arguments[3]}); opt.element.triggerHandler('upload.progress', {
}, done: function (ret, index) { number: number, event: arguments[2], file: arguments[3]
option.element.triggerHandler('upload.done', {file: option.cache[index], data: ret}); });
if (++option.count.uploaded >= option.count.total) { }, done: function (ret, idx) {
option.element.triggerHandler('upload.complete', {});
option.element.html(option.element.data('html')); /*! 检查单个文件上传返回的结果 */
option.hload || $.msg.close(option.load); if (ret.code < 1) return $.msg.tips(ret.info || '文件上传失败！');
option.uploader.reload(); if (typeof opt.cache[idx].xurl !== 'string') return $.msg.tips('无效的文件上传对象！');
}
if (typeof ret.code === 'number' && parseInt(ret.code) === 0) { /*! 单个文件上传成功结果处理 */
return $.msg.tips(ret.info || '文件上传失败！'); if (typeof callable === 'function') {
} callable.call(opt.element, opt.cache[idx].xurl, opt.cache['id']);
if (typeof option.cache[index].xurl !== 'string') {
return $.msg.tips('无效的文件对象！');
}
if (typeof ret.uploaded === 'undefined' && typeof option.cache[index].xurl === 'string') {
ret = {uploaded: true, url: option.cache[index].xurl};
}
if (ret.uploaded) {
if (typeof callable === 'function') {
callable.call(option.element, ret.url, option.cache[index]);
} else {
option.input.val(ret.url).trigger('change');
}
} else { } else {
$.msg.tips(ret.info || ret.error.message || '文件上传出错！'); opt.multiple < 1 && opt.input.val(opt.cache[idx].xurl).trigger('change');
}
(opt.hload || $.msg.close(opt.load)), opt.element.html(opt.element.data('html'));
opt.element.triggerHandler('upload.done', {file: opt.cache[idx], data: ret});
/*! 所有文件上传完成后结果处理 */
if (++opt.count.uploaded >= opt.count.total) {
if (opt.multiple > 0) {
var urls = [];
for (var i in opt.cache) urls.push(opt.cache[i].xurl)
opt.input.val(urls.join('|')).trigger('change');
}
opt.element.triggerHandler('upload.complete', {file: opt.cache});
(opt.cache = [], opt.files = []), opt.uploader.reload();
} }
} }
}); });

23
public/static/admin.js
View File

@ -191,12 +191,8 @@ $(function () {
$(this.elem).val(value).trigger('change'); $(this.elem).val(value).trigger('change');
} }
}); });
}), $dom.find('[data-file]:not([data-inited])').map(function (index, elem, $this, field) { }), $dom.find('[data-file]:not([data-inited])').map(function () {
$this = $(elem), field = this.dataset.field || 'file'; $(this).uploadFile();
if (!$this.data('input')) $this.data('input', $('[name="' + field + '"]').get(0));
$this.uploadFile(function (url, file) {
$($this.data('input')).data('file', file).val(url).trigger('change');
});
}), $dom.find('[data-lazy-src]:not([data-lazy-loaded])').each(function () { }), $dom.find('[data-lazy-src]:not([data-lazy-loaded])').each(function () {
if (this.dataset.lazyLoaded !== 'true') { if (this.dataset.lazyLoaded !== 'true') {
if (this.nodeName === 'IMG') { if (this.nodeName === 'IMG') {
@ -531,12 +527,12 @@ $(function () {
}; };
/*! 全局文件上传入口 */ /*! 全局文件上传入口 */
$.fn.uploadFile = function (callback) { $.fn.uploadFile = function (callable) {
if (this.attr('data-inited')) return false; if (this.data('inited')) return false;
var that = this, mode = this.attr('data-file') || 'one'; var that = this, mode = this.data('file') || 'one';
this.attr('data-inited', true).attr('data-multiple', (mode !== 'btn' && mode !== 'one') ? 1 : 0); this.data('inited', true).data('multiple', mode !== 'one' ? 1 : 0);
require(['upload'], function (apply) { require(['upload'], function (apply) {
apply.call(this, that, callback); apply.call(this, that, callable);
}); });
}; };
@ -544,9 +540,8 @@ $(function () {
$.fn.uploadOneImage = function () { $.fn.uploadOneImage = function () {
return this.each(function ($in, $tpl) { return this.each(function ($in, $tpl) {
$in = $(this), $tpl = $('<a data-file="one" class="uploadimage transition"><span class="layui-icon">&#x1006;</span></a>'); $in = $(this), $tpl = $('<a data-file="one" class="uploadimage transition"><span class="layui-icon">&#x1006;</span></a>');
$tpl.attr('data-type', $in.data('type') || 'png,jpg,gif').attr('data-size', $in.data('size') || 0); $tpl.attr('data-size', $in.data('size') || 0).attr('data-type', $in.data('type') || 'png,jpg,gif');
$tpl.attr('data-field', $in.attr('name') || 'image').data('input', this); $tpl.attr('data-field', $in.attr('name') || 'image').data('input', this).find('span').on('click', function (event) {
$tpl.find('span').on('click', function (event) {
event.stopPropagation(), $tpl.attr('style', ''), $in.val(''); event.stopPropagation(), $tpl.attr('style', ''), $in.val('');
}); });
$in.attr('name', $tpl.attr('data-field')).after($tpl).on('change', function () { $in.attr('name', $tpl.attr('data-field')).after($tpl).on('change', function () {