diff --git a/app/admin/controller/api/Upload.php b/app/admin/controller/api/Upload.php index 02c1f8bef..7130972e6 100644 --- a/app/admin/controller/api/Upload.php +++ b/app/admin/controller/api/Upload.php @@ -110,7 +110,6 @@ class Upload extends Controller /** * 文件上传入口 * @login true - * @return Json * @throws \think\db\exception\DataNotFoundException * @throws \think\db\exception\DbException * @throws \think\db\exception\ModelNotFoundException @@ -118,15 +117,15 @@ class Upload extends Controller public function file(): Json { if (!($file = $this->getFile())->isValid()) { - return json(['uploaded' => false, 'error' => ['message' => '文件上传异常,文件过大或未上传!']]); + $this->error('文件上传异常,文件过大或未上传!'); } $extension = strtolower($file->getOriginalExtension()); [$pathname, $original] = [$file->getPathname(), $file->getOriginalName()]; 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'])) { - return json(['uploaded' => false, 'error' => ['message' => '文件安全保护,可执行文件禁止上传!']]); + $this->error('文件安全保护,可执行文件禁止上传!'); } [$this->type, $this->safe] = [$this->getType(), $this->getSafe()]; $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); if (in_array($extension, ['jpg', 'gif', 'png', 'bmp', 'jpeg', 'wbmp'])) { if ($this->imgNotSafe($distname) && $local->del($this->name)) { - return json(['uploaded' => false, 'error' => ['message' => '图片未通过安全检查!']]); + $this->error('图片未通过安全检查!'); } [$width, $height] = getimagesize($distname); if (($width < 1 || $height < 1) && $local->del($this->name)) { - return json(['uploaded' => false, 'error' => ['message' => '读取图片的尺寸失败!']]); + $this->error('读取图片的尺寸失败!'); } } } else { $bina = file_get_contents($pathname); $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) { throw $exception; } catch (\Exception $exception) { - return json(['uploaded' => false, 'error' => ['message' => $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' => '文件处理失败,请稍候再试!']]); + $this->error($exception->getMessage()); } } diff --git a/app/admin/view/api/upload.js b/app/admin/view/api/upload.js index c097df63e..bf832f9e2 100644 --- a/app/admin/view/api/upload.js +++ b/app/admin/view/api/upload.js @@ -1,59 +1,59 @@ define(['md5'], function (SparkMD5, allowMime) { allowMime = JSON.parse('{$exts|raw}'); - return function (element, callable, option) { + return function (element, callable, completeCallable) { /*! 初始化变量 */ - option = {element: $(element), exts: [], mimes: [], files: {}, cache: {}, load: 0}; - option.count = {total: 0, uploaded: 0}, option.size = option.element.data('size') || 0; - option.safe = option.element.data('safe') ? 1 : 0, option.hload = option.element.data('hide-load') ? 1 : 0; - option.field = option.element.data('field') || 'file', option.input = $('[name="_field_"]'.replace('_field_', option.field)); - option.uptype = option.safe ? 'local' : option.element.attr('data-uptype') || '', option.multiple = option.element.data('multiple') > 0; + var opt = {element: $(element), exts: [], mimes: [], files: {}, cache: {}, load: 0}; + opt.count = {total: 0, uploaded: 0}, opt.size = opt.element.data('size') || 0; + opt.safe = opt.element.data('safe') ? 1 : 0, opt.hload = opt.element.data('hide-load') ? 1 : 0; + opt.field = opt.element.data('field') || 'file', opt.input = $('input[name="' + opt.field + '"]:not([type=file])'); + 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) { - if (allowMime[ext]) option.exts.push(ext), option.mimes.push(allowMime[ext]); + $((opt.element.data('type') || '').split(',')).map(function (i, 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")}', - auto: false, elem: element, accept: 'file', multiple: option.multiple, - exts: option.exts.join('|'), acceptMime: option.mimes.join(','), choose: function (object) { - option.element.triggerHandler('upload.choose', option.files = object.pushFile()); - option.uploader.config.elem.next().val(''), layui.each(option.files, function (index, file) { - if (option.size > 0 && file.size > option.size) { - return delete option.files[index], $.msg.tips('文件大小超出上传限制!'); + auto: false, elem: element, accept: 'file', multiple: opt.multiple, + exts: opt.exts.join('|'), acceptMime: opt.mimes.join(','), choose: function (object) { + opt.element.triggerHandler('upload.choose', opt.files = object.pushFile()); + opt.uploader.config.elem.next().val(''), layui.each(opt.files, function (index, file) { + if (opt.size > 0 && file.size > opt.size) { + return delete opt.files[index], $.msg.tips('文件大小超出上传限制!'); } - option.load = option.hload || $.msg.loading('上传进度 0%'); - option.count.total++, file.index = index, option.cache[index] = file, delete option.files[index]; + opt.load = opt.hload || $.msg.loading('上传进度 0%'); + opt.count.total++, file.index = index, opt.cache[index] = file, delete opt.files[index]; md5file(file).then(function (file) { - option.element.triggerHandler('upload.hash', file); + opt.element.triggerHandler('upload.hash', file); 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) { file.xurl = ret.data.url; - option.uploader.config.url = ret.data.server; - option.uploader.config.data.key = ret.data.key; - option.uploader.config.data.safe = ret.data.safe; - option.uploader.config.data.uptype = ret.data.uptype; + opt.uploader.config.url = ret.data.server; + opt.uploader.config.data.key = ret.data.key; + opt.uploader.config.data.safe = ret.data.safe; + opt.uploader.config.data.uptype = ret.data.uptype; 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') { - option.uploader.config.data['policy'] = ret.data.policy; - option.uploader.config.data['signature'] = ret.data.signature; - option.uploader.config.data['OSSAccessKeyId'] = ret.data.OSSAccessKeyId; - option.uploader.config.data['success_action_status'] = 200; - option.uploader.config.data['Content-Disposition'] = 'inline;filename=' + encodeURIComponent(file.name); + opt.uploader.config.data['policy'] = ret.data.policy; + opt.uploader.config.data['signature'] = ret.data.signature; + opt.uploader.config.data['OSSAccessKeyId'] = ret.data.OSSAccessKeyId; + opt.uploader.config.data['success_action_status'] = 200; + opt.uploader.config.data['Content-Disposition'] = 'inline;filename=' + encodeURIComponent(file.name); } else if (ret.data.uptype === 'txcos') { - option.uploader.config.data['q-ak'] = ret.data['q-ak']; - option.uploader.config.data['policy'] = ret.data.policy; - option.uploader.config.data['q-key-time'] = ret.data['q-key-time']; - option.uploader.config.data['q-signature'] = ret.data['q-signature']; - option.uploader.config.data['q-sign-algorithm'] = ret.data['q-sign-algorithm']; - option.uploader.config.data['success_action_status'] = 200; - option.uploader.config.data['Content-Disposition'] = 'inline;filename=' + encodeURIComponent(file.name); + opt.uploader.config.data['q-ak'] = ret.data['q-ak']; + opt.uploader.config.data['policy'] = ret.data.policy; + opt.uploader.config.data['q-key-time'] = ret.data['q-key-time']; + opt.uploader.config.data['q-signature'] = ret.data['q-signature']; + opt.uploader.config.data['q-sign-algorithm'] = ret.data['q-sign-algorithm']; + opt.uploader.config.data['success_action_status'] = 200; + opt.uploader.config.data['Content-Disposition'] = 'inline;filename=' + encodeURIComponent(file.name); } object.upload(file.index, file); } else if (parseInt(ret.code) === 200) { 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 { $.msg.tips(ret.info || ret.error.message || '文件上传出错!'); } @@ -63,32 +63,34 @@ define(['md5'], function (SparkMD5, allowMime) { }); }, progress: function (number) { $('[data-upload-progress]').html(number + '%'); - option.element.triggerHandler('upload.progress', {number: number, event: arguments[2], file: arguments[3]}); - }, done: function (ret, index) { - option.element.triggerHandler('upload.done', {file: option.cache[index], data: ret}); - if (++option.count.uploaded >= option.count.total) { - option.element.triggerHandler('upload.complete', {}); - option.element.html(option.element.data('html')); - option.hload || $.msg.close(option.load); - option.uploader.reload(); - } - if (typeof ret.code === 'number' && parseInt(ret.code) === 0) { - return $.msg.tips(ret.info || '文件上传失败!'); - } - 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'); - } + opt.element.triggerHandler('upload.progress', { + number: number, event: arguments[2], file: arguments[3] + }); + }, done: function (ret, idx) { + + /*! 检查单个文件上传返回的结果 */ + if (ret.code < 1) return $.msg.tips(ret.info || '文件上传失败!'); + if (typeof opt.cache[idx].xurl !== 'string') return $.msg.tips('无效的文件上传对象!'); + + /*! 单个文件上传成功结果处理 */ + if (typeof callable === 'function') { + callable.call(opt.element, opt.cache[idx].xurl, opt.cache['id']); } 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(); } } }); diff --git a/public/static/admin.js b/public/static/admin.js index 275020c7b..85a3959a3 100644 --- a/public/static/admin.js +++ b/public/static/admin.js @@ -191,12 +191,8 @@ $(function () { $(this.elem).val(value).trigger('change'); } }); - }), $dom.find('[data-file]:not([data-inited])').map(function (index, elem, $this, field) { - $this = $(elem), field = this.dataset.field || 'file'; - 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-file]:not([data-inited])').map(function () { + $(this).uploadFile(); }), $dom.find('[data-lazy-src]:not([data-lazy-loaded])').each(function () { if (this.dataset.lazyLoaded !== 'true') { if (this.nodeName === 'IMG') { @@ -531,12 +527,12 @@ $(function () { }; /*! 全局文件上传入口 */ - $.fn.uploadFile = function (callback) { - if (this.attr('data-inited')) return false; - var that = this, mode = this.attr('data-file') || 'one'; - this.attr('data-inited', true).attr('data-multiple', (mode !== 'btn' && mode !== 'one') ? 1 : 0); + $.fn.uploadFile = function (callable) { + if (this.data('inited')) return false; + var that = this, mode = this.data('file') || 'one'; + this.data('inited', true).data('multiple', mode !== 'one' ? 1 : 0); require(['upload'], function (apply) { - apply.call(this, that, callback); + apply.call(this, that, callable); }); }; @@ -544,9 +540,8 @@ $(function () { $.fn.uploadOneImage = function () { return this.each(function ($in, $tpl) { $in = $(this), $tpl = $(''); - $tpl.attr('data-type', $in.data('type') || 'png,jpg,gif').attr('data-size', $in.data('size') || 0); - $tpl.attr('data-field', $in.attr('name') || 'image').data('input', this); - $tpl.find('span').on('click', function (event) { + $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).find('span').on('click', function (event) { event.stopPropagation(), $tpl.attr('style', ''), $in.val(''); }); $in.attr('name', $tpl.attr('data-field')).after($tpl).on('change', function () {