这篇文章主要介绍yii2用uploadify的方法,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!
Uploadify是来自国外的一款优秀jQuery插件,主要功能是批量上传文件
下载Uploadify控件可以到git网站上找,找到自己适合用的.例如我们下面用个就是从
https://github.com/xjflyttp/yii2-uploadify-widget 下载的,里面也有详细的操作文档。
① 配置composer.json (就存在网站根目录下),找到require,然后添加我们的uploadify
"require": {
"php": ">=5.4.0",
"yiisoft/yii2": ">=2.0.6",
"yiisoft/yii2-bootstrap": "*",
"yiisoft/yii2-swiftmailer": "*",
"xj/yii2-uploadify-widget": "~2.0.0" //这里是新添加的
},
② 利用composer 将yii2-uploadify-widget 下载到我们网站, 打开在网站根目录运行命令行 ,等待下载如图:
③ 视图的处理
<?php
use yii\web\JsExpression;
//外部TAG
echo Html::fileInput('test', NULL, ['id' => 'test']);
echo Uploadify::widget([
'url' => yii\helpers\Url::to(['s-upload']),
'id' => 'test', //需要跟上fileInput 的id 对应
'csrf' => true,
'renderTag' => false,
'jsOptions' => [
'width' => 100,
'height' => 40,
'onUploadError' => new JsExpression(<<<EOF
function(file, errorCode, errorMsg, errorString) {
console.log('The file ' + file.name + ' could not be uploaded: ' + errorString + errorCode + errorMsg);
}
EOF
),
'onUploadSuccess' => new JsExpression(<<<EOF
function(file, data, response) {
data = JSON.parse(data);
if (data.error) {
console.log(data.msg);
} else {
//在此处理你的图片
console.log(data.fileUrl);
}
}
EOF
④ 配置Controller 层
<?php
namespace \backend\controllers;
use xj\uploadify\UploadAction;
class TestController extends \yii\web\Controller
{
public function actions() {
return [
's-upload' => [
'class' => UploadAction::className(),
//磁盘目录
'basePath' => '@webroot/upload',
//访问目录
'baseUrl' => '@web/upload',
//防止跨站攻击
'enableCsrf' => true, // default
'postFieldName' => 'Filedata', // default
//BEGIN METHOD
'format' => [$this, 'methodName'],
//END METHOD
//BEGIN CLOSURE BY-HASH
//是否覆盖相同文件
'overwriteIfExist' => true,
//创建图片名称
'format' => function (UploadAction $action) {
$fileext = $action->uploadfile->getExtension();
$filename = sha1_file($action->uploadfile->tempName);
return "{$filename}.{$fileext}";
},
//想要多调用这个函数
'format' => function (UploadAction $action) {
$fileext = $action->uploadfile->getExtension();
$filehash = sha1(uniqid() . time());
$p1 = substr($filehash, 0, 2);
$p2 = substr($filehash, 2, 2);
return "{$p1}/{$p2}/{$filehash}.{$fileext}";
},
*/
'validateOptions' => [
'extensions' => ['jpg', 'png'], //后缀验证
'maxSize' => 1 * 1024 * 1024, //上传大小限制
],
//验证前处理
'beforeValidate' => function (UploadAction $action) {
//throw new Exception('test error');
},
//验证后处理
'afterValidate' => function (UploadAction $action) {},
//保存前处理
'beforeSave' => function (UploadAction $action) {},
//保存后处理
'afterSave' => function (UploadAction $action) {
//$action->output 返回给浏览器的数据
//返回Url 图片返回的路径
//$action->getWebUrl()
//图片的名称
//$action->getFilename();
//保存图片的物理位置
//$action->getSavePath();
//输出
//$action->output['fileUrl'] = $action->getWebUrl();
//$action->output['fileName'] = $action->getFilename();
//$action->output['filePath'] = $action->getSavePath();
//$action->getFilename(); // "image/yyyymmddtimerand.jpg"
//$action->getWebUrl(); // "baseUrl + filename, /upload/image/yyyymmddtimerand.jpg"
//$action->getSavePath(); // "/var/www/htdocs/upload/image/yyyymmddtimerand.jpg"
$action->output[‘fileUrl’] = $action->getWebUrl()
},
],
];
}
}
?>
以上是“yii2用uploadify的方法”这篇文章的所有内容,感谢各位的阅读!希望分享的内容对大家有帮助,更多相关知识,欢迎关注亿速云行业资讯频道!
亿速云「云服务器」,即开即用、新一代英特尔至强铂金CPU、三副本存储NVMe SSD云盘,价格低至29元/月。点击查看>>
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。