图片上传几乎是应用必备,前面也针对 做了一篇详细的说明,不过很多人反馈各种问题,下面针对 webuploader 的使用单独写了一个组件。该组件可以更好的处理 Yii2 在图片上传过程中带来的一系列问题,目前支持多图多字段多modal的混合上传。
介绍之前我们先演示下效果。
安装
推荐使用composer进行安装
使用
params.php或者params-local.php内增加webuploader和domain配置项
'http://blog.m/','webuploader' => [
// 后端处理图片的地址,value 是相对的地址
'uploadUrl' => 'blog/upload',// 多文件分隔符
'delimiter' => ',',// 基本配置
'baseConfig' => [
'defaultImage' => 'http://img1.imgtn.bdimg.com/it/u=2056478505,162569476&fm=26&gp=0.jpg','disableGlobalDnd' => true,'accept' => [
'title' => 'Images','extensions' => 'gif,jpg,jpeg,bmp,png','mimeTypes' => 'image/*',],'pick' => [
'multiple' => false,
webuploader['baseConfig'] 参考 webuploader官方的参数说明
视图文件
单图
rush:PHP;">
field($model,'file')->widget('manks\FileInput',[
]);
?>
多图
rush:PHP;">
field($model,'file2')->widget('manks\FileInput',[
'clientOptions' => [
'pick' => [
'multiple' => true,// 'server' => Url::to('upload/u2'),// 'accept' => [
// 'extensions' => 'png',// ],]); ?>
控制器 controller的地址可以在params.PHP或者params-local.PHP中配置 Yii::$app->params['webuploader']['uploadUrl'],也可以在 clientOptions中配置 server 项。控制器需要返回的数据格式如下
rush:PHP;">
// 错误时
{"code": 1,"msg": "error"}
// 正确时, 其中 attachment 指的是保存在数据库中的路径,url 是该图片在web可访问的地址
{"code": 0,"url": "http://domain/图片地址","attachment": "图片地址"}
clientOptions同样参考 webuploader官方的参数说明
注意
如果是修改的多图片操作,务必保证 $model->file = 'src1,src2,src3,...'; 或者 $model->file = ['src1','src2'. 'src3',...];
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程之家。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。