Home > PHP Framework > YII > How to use uploadify in yii2

How to use uploadify in yii2

(*-*)浩
Release: 2019-11-05 10:04:01
Original
3647 people have browsed it

Uploadify is an excellent jQuery plug-in from abroad. Its main function is to upload files in batches.

How to use uploadify in yii2

To download the Uploadify control, you can find it on the git website and find the one that suits you. .For example, the one we use below is downloaded from

https://github.com/xjflyttp/yii2-uploadify-widget, which also has detailed operation documents. (Recommended learning: yii tutorial)

① Configure composer.json (it exists in the root directory of the website), find require, and then add our uploadify

"require": {
"php": ">=5.4.0",
"yiisoft/yii2": ">=2.0.6",
"yiisoft/yii2-bootstrap": "*",
"yiisoft/yii2-swiftmailer": "*",
"xj/yii2-uploadify-widget": "~2.0.0" //这里是新添加的
},
Copy after login

② Utilize Composer downloads yii2-uploadify-widget to our website, opens and runs the command line in the root directory of the website, and waits for downloading as shown in the figure:

How to use uploadify in yii2

##③ View processing

<?php
use yii\web\JsExpression;
//外部TAG
echo Html::fileInput(&#39;test&#39;, NULL, [&#39;id&#39; => &#39;test&#39;]);
echo Uploadify::widget([
    &#39;url&#39; => yii\helpers\Url::to([&#39;s-upload&#39;]),
    &#39;id&#39; => &#39;test&#39;, //需要跟上fileInput 的id 对应
    &#39;csrf&#39; => true,
    &#39;renderTag&#39; => false,
     &#39;jsOptions&#39; => [
                  &#39;width&#39; => 100,
                  &#39;height&#39; => 40,
                  &#39;onUploadError&#39; => new JsExpression(<<<EOF
                  function(file, errorCode, errorMsg, errorString) {
                        console.log(&#39;The file &#39; + file.name + &#39; could not be uploaded: &#39; + errorString + errorCode + errorMsg);
                    }
EOF
                    ),
                    &#39;onUploadSuccess&#39; => new JsExpression(<<<EOF
                    function(file, data, response) {
                        data = JSON.parse(data);
                        if (data.error) {
                            console.log(data.msg);
                             } else {
                                //在此处理你的图片
                               console.log(data.fileUrl);
                        }
                    }
EOF
Copy after login

④ Configure Controller layer

<?php
namespace \backend\controllers;
use xj\uploadify\UploadAction;
class TestController extends \yii\web\Controller
{
   public function actions() {
    return [
        &#39;s-upload&#39; => [
            &#39;class&#39; => UploadAction::className(),
            //磁盘目录
            &#39;basePath&#39; => &#39;@webroot/upload&#39;,
            //访问目录
            &#39;baseUrl&#39; => &#39;@web/upload&#39;,
            //防止跨站攻击
            &#39;enableCsrf&#39; => true, // default
            &#39;postFieldName&#39; => &#39;Filedata&#39;, // default
            //BEGIN METHOD
            &#39;format&#39; => [$this, &#39;methodName&#39;],
            //END METHOD
            //BEGIN CLOSURE BY-HASH
            //是否覆盖相同文件
            &#39;overwriteIfExist&#39; => true,
            //创建图片名称
            &#39;format&#39; => function (UploadAction $action) {
                $fileext = $action->uploadfile->getExtension();
                $filename = sha1_file($action->uploadfile->tempName);
                return "{$filename}.{$fileext}";
            },
             //想要多调用这个函数
            &#39;format&#39; => 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}";
            },
            */
            &#39;validateOptions&#39; => [
                &#39;extensions&#39; => [&#39;jpg&#39;, &#39;png&#39;], //后缀验证
                &#39;maxSize&#39; => 1 * 1024 * 1024, //上传大小限制
             ],
             //验证前处理
            &#39;beforeValidate&#39; => function (UploadAction $action) {
                //throw new Exception(&#39;test error&#39;);
                },
             //验证后处理
            &#39;afterValidate&#39; => function (UploadAction $action) {},
             //保存前处理
            &#39;beforeSave&#39; => function (UploadAction $action) {},
            //保存后处理
            &#39;afterSave&#39; => function (UploadAction $action) {
                //$action->output 返回给浏览器的数据
                //返回Url 图片返回的路径
                //$action->getWebUrl()
                //图片的名称
                //$action->getFilename();
                //保存图片的物理位置
                //$action->getSavePath();
                //输出                                 
                //$action->output[&#39;fileUrl&#39;] = $action->getWebUrl();
                //$action->output[&#39;fileName&#39;] = $action->getFilename();
                //$action->output[&#39;filePath&#39;] = $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()
              },
           ],
        ];
     }
   }
?>
Copy after login


The above is the detailed content of How to use uploadify in yii2. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template