本文讲解了plupload的相关代码,实现了ajax多图同时上传,然后将图片进行缩放,最后显示图片,分享给大家供大家参考,具体内容如下
1、文章视图中调用Plupload
<?= commonwidgetsPlupload::widget([ "model"=>$model, "attribute"=>"cover_img", "url"=>"/file/upload",//处理文件上传控制器])?>
2、commonwidgetsPlupload 组件
<?phpnamespace commonwidgets;use backendassetsUploadAsset;use yii;use yiihelpersHtml;use yiiaseException;class Plupload extends yiiootstrapWidget{ public $model; public $attribute; public $name; public $url; private $_html; public function init(){ parent::init(); if(!$this->url){ throw new Exception("url参数不能为空"); } if(!$this->model){ throw new Exception("model属性不能为空"); } if(!$this->attribute){ throw new Exception("attribute属性不能为空"); } } public function run(){ $model = $this->model; $attribute = $this->attribute; $path = $model->$attribute?$model->$attribute:"/images/noimage.gif";//显示文章图片或者默认图片 $this->_html.="<div class="form-group field-article-author" id="container">"; $this->_html.=Html::activeLabel($model,$attribute); $this->_html.=Html::activeHiddenInput($model,$attribute,["id"=>"hidden_input","value"=>$path]); $this->_html .= "<div id="pickfiles" style="height:50px;min-width:50px;max-width: 300px;overflow: hidden;"><img height="50" src="".$path."" /></div>"; $this->_html.="</div> "; UploadAsset::register($this->view); $this->view->registerJs( "$(function(){ initCoverImageUploader("pickfiles","container","2mb","".$this->url."","".Yii::$app->request->getCsrfToken().""); });" ); return $this->_html; }}3、backendassetsUploadAsset注册相关js
<?phpnamespace backendassets;use yiiwebAssetBundle;class UploadAsset extends AssetBundle{ public $basePath = "@webroot"; public $baseUrl = "@web"; public $css = [ ]; public $js = [ "js/upload.js" ]; public $depends = [ "backendassetsPluploadAsset", ];}4、js/upload.jsajax处理代码
function initCoverImageUploader(buttonId,contatinerId,maxFileSize,url,csrfToken){ var uploader = new plupload.Uploader({ runtimes : "html5,flash,silverlight,html4", browse_button :buttonId, // you can pass an id... container: contatinerId, // ... or DOM Element itself url : url, flash_swf_url : "@vendor/moxiecode/plupload/js/Moxie.swf", silverlight_xap_url : "@vendor/moxiecode/plupload//js/Moxie.xap", filters : { max_file_size : maxFileSize, mime_types: [ {title : "Image files", extensions : "jpg,gif,png"}, {title : "Zip files", extensions : "zip"} ] }, multipart_params:{ "_csrf":csrfToken }, init: { FilesAdded: function(up, files) { uploader.start(); }, UploadProgress: function(up, file) { $("#"+contatinerId+" p").text("已上传:"+file.percent+"%"); }, FileUploaded:function (up, file, result) { result = $.parseJSON(result.response); if(result.code == 0){ $("#"+buttonId).html("<img src=""+result.path+"" height="50" />"); $("#hidden_input").val(result.path); //console.log(result.message); } }, Error: function(up, err) { document.getElementById("console").appendChild(document.createTextNode("Error #" + err.code + ": " + err.message)); } } }); uploader.init();}5、backendassetsPluploadAsset注册plupload相关资源
<?phpnamespace backendassets;use yiiwebAssetBundle;class PluploadAsset extends AssetBundle{ public $sourcePath = "@vendor/moxiecode/plupload"; public $css = [ ]; public $js = [ "js/plupload.full.min.js", ]; public $depends = [ "yiiwebJqueryAsset", ];}6、FileController控制器调用模型处理上传文件,并且返回结果
class FileController extends BaseController{ public function actionUpload(){ Yii::$app->response->format=Response::FORMAT_JSON; $model = New ImageUpload(); $model->fileInputName = "file"; if($model->save()){ return ["code"=>0,"message"=>$model->getMessage(),"path"=>$model->getUrlPath()]; }else{ return ["code"=>1,"message"=>$model->getMessage()]; } }}7、commonmodelsImageUpload模型中对上传文件做了一定的检测,然后将源文件按照一定的比例进行缩放
<?phpnamespace commonmodels;use yiiaseException;use yiihelpersFileHelper;use yiiwebUploadedFile;class ImageUpload extends yiiaseObject{ public $fileInputName = "file";//上传表单 file name public $savePath ;//图像保存根位置 public $allowExt = ["jpg","png","jpeg","gif","bmp"];//允许上传后缀 public $maxFileSize=1024100000;//最大大小 public $allowType = ["image/jpeg","image/bmp","image/gif","image/png","image/pjpeg","image/bmp","image/gif","image/x-png","image/pjpeg","image/bmp", "image/gif" ,"image/x-png","image/pjpeg","image/bmp","image/gif","image/x-png"]; private $_uploadFile;//上传文件 private $filePath;//文件路径 private $urlPath;//访问路径 private $res=false;//返回状态 private $message;//返回信息 public function getMessage(){ return $this->message; } public function getUrlPath(){ return $this->urlPath; } public function init(){ if(!$this->fileInputName) throw new Exception("fileInputName属性不能为空"); if(!$this->savePath) $this->savePath = Yii::$app->basePath."/web/uploads/images"; $this->savePath = rtrim($this->savePath,"/"); if(!file_exists($this->savePath)){ if(! FileHelper::createDirectory($this->savePath)){ $this->message = "没有权限创建".$this->savePath; return false; } } $this->_uploadFile = UploadedFile::getInstanceByName($this->fileInputName); if(!$this->_uploadFile){ $this->message = "没有找到上传文件"; return false; } if($this->_uploadFile->error){ $this->message = "上传失败"; return false; } if(!in_array($this->extension,$this->allowExt) || !in_array($this->type,$this->allowType)){ $this->message = "该文件类型不允许上传"; return false; } if($this->_uploadFile->size> $this->maxFileSize){ $this->message = "文件过大"; return false; } $path = date("Y-m",time()); if(!file_exists($this->savePath."/".$path)){ FileHelper::createDirectory($this->savePath."/".$path); } $name = substr(Yii::$app->security->generateRandomString(),-4,4); $this->filePath = $this->savePath."/".$path."/".$this->baseName."--".$name.".".$this->extension; $this->urlPath = "/uploads/images/".$path."/".$this->baseName."--".$name.".".$this->extension; } public function save(){ if($this->_uploadFile->saveAs($this->filePath)){ $this->CreateThumbnail($this->filePath);//缩放图片 $this->res = true; }else{ $this->res = false; } if($this->res){ $this->message = $this->_uploadFile->baseName.".".$this->_uploadFile->extension."上传成功"; }else{ $this->message = $this->_uploadFile->baseName.".".$this->_uploadFile->extension."上传失败"; } return $this->res; } /** * 获取文件名字 * @return null */ public function getBaseName(){ if($this->_uploadFile){ return $this->_uploadFile->baseName; }else{ return null; } } /** * 返回文件后缀 * @return null */ public function getExtension(){ if($this->_uploadFile){ return $this->_uploadFile->extension; }else{ return null; } } /** * 返回文件类型 * @return mixed */ public function getType(){ if($this->_uploadFile){ return $this->_uploadFile->type; } return null; } /** * 生成保持原图纵横比的缩略图,支持.png .jpg .gif * 缩略图类型统一为.png格式 * $srcFile 原图像文件名称 * $toFile 缩略图文件名称,为空覆盖原图像文件 * $toW 缩略图宽 * $toH 缩略图高 * @return bool */ public static function CreateThumbnail($srcFile, $toFile="", $toW=100, $toH=100) { if ($toFile == "") $toFile = $srcFile; $data = getimagesize($srcFile);//返回含有4个单元的数组,0-宽,1-高,2-图像类型,3-宽高的文本描述。 if (!$data) return false; //将文件载入到资源变量im中 switch ($data[2]) //1-GIF,2-JPG,3-PNG { case 1: if(!function_exists("imagecreatefromgif")) return false; $im = imagecreatefromgif($srcFile); break; case 2: if(!function_exists("imagecreatefromjpeg")) return false; $im = imagecreatefromjpeg($srcFile); break; case 3: if(!function_exists("imagecreatefrompng")) return false; $im = imagecreatefrompng($srcFile); break; } //计算缩略图的宽高 $srcW = imagesx($im); $srcH = imagesy($im); $toWH = $toW / $toH; $srcWH = $srcW / $srcH; if ($toWH <= $srcWH) { $ftoW = $toW; $ftoH = (int)($ftoW * ($srcH / $srcW)); } else { $ftoH = $toH; $ftoW = (int)($ftoH * ($srcW / $srcH)); } if (function_exists("imagecreatetruecolor")) { $ni = imagecreatetruecolor($ftoW, $ftoH); //新建一个真彩色图像 if ($ni) { //重采样拷贝部分图像并调整大小 可保持较好的清晰度 imagecopyresampled($ni, $im, 0, 0, 0, 0, $ftoW, $ftoH, $srcW, $srcH); } else { //拷贝部分图像并调整大小 $ni = imagecreate($ftoW, $ftoH); imagecopyresized($ni, $im, 0, 0, 0, 0, $ftoW, $ftoH, $srcW, $srcH); } } else { $ni = imagecreate($ftoW, $ftoH); imagecopyresized($ni, $im, 0, 0, 0, 0, $ftoW, $ftoH, $srcW, $srcH); } switch ($data[2]) //1-GIF,2-JPG,3-PNG { case 1: imagegif($ni, $toFile); break; case 2: imagejpeg($ni, $toFile); break; case 3: imagepng($ni, $toFile); break; } ImageDestroy($ni); ImageDestroy($im); return $toFile; }}以上就是本文的全部内容,希望对大家学习php程序设计有所帮助。