Maison > cadre php > YII > Comment utiliser uploadify dans yii2

Comment utiliser uploadify dans yii2

(*-*)浩
Libérer: 2019-11-05 10:04:01
original
3647 Les gens l'ont consulté

Uploadify est un excellent plug-in jQuery étranger. Sa fonction principale est de télécharger des fichiers par lots

Comment utiliser uploadify dans yii2

Pour télécharger le contrôle Uploadify, vous pouvez le trouver sur le site. git et trouvez celui qui vous convient. Par exemple, celui que nous utilisons ci-dessous est téléchargé depuis

https://github.com/xjflyttp/yii2-uploadify-widget, qui contient également des documents de fonctionnement détaillés. . (Apprentissage recommandé : tutoriel yii)

① Configurez composer.json (il existe dans le répertoire racine du site Web), recherchez require, puis ajoutez notre uploadify

"require": {
"php": ">=5.4.0",
"yiisoft/yii2": ">=2.0.6",
"yiisoft/yii2-bootstrap": "*",
"yiisoft/yii2-swiftmailer": "*",
"xj/yii2-uploadify-widget": "~2.0.0" //这里是新添加的
},
Copier après la connexion

② Utilisez composer downloads yii2-uploadify-widget sur notre site Web, ouvrez la ligne de commande exécutée dans le répertoire racine du site Web et attendez le téléchargement comme indiqué dans la figure :

Comment utiliser uploadify dans yii2

③ Afficher le traitement

<?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
Copier après la connexion

④Configurer la couche contrôleur

<?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()
              },
           ],
        ];
     }
   }
?>
Copier après la connexion


Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal