上传图片时,需注意事项

来源:互联网 发布:淘宝详情页文字大小 编辑:程序博客网 时间:2024/06/05 08:47
   /**     * 后台上传图片     * type 1 为小程序图片     */    public function actionAdd(){        if($_FILES  && $_FILES["image"]['name']){            $request = Yii::$app->request;            $root = '/mnt/tmpfile/static/';            $source_name = $_FILES["image"]['name'];            $image_ext  = explode('.',$source_name);            if($request->post('type',0) == 1){                //保存的目录                $path = $root.'app/'.date('Ymd');            }else{                $dir_name = $request->post('dir_name',date('Ymd'));                $path = $root.$dir_name;            }            if(!is_dir($path)){                mkdir($path,0777,true);            }            $file_name = date('YmdHis').'.'.$image_ext[1];            $flag = move_uploaded_file($_FILES["image"]['tmp_name'],$path.'/'.$file_name);            if($flag){                $img_dir =str_replace('/mnt/tmpfile',$this->host,$path);                Yii::$app->db->createCommand()->insert($this->table_name,[                    'name'=>$request->post('name',''),                    'type'=>$request->post('type',1),                    'url_big'=>$img_dir.'/'.$file_name,                    'add_time'=>time(),                    'source_name'=>$source_name                ])->execute();                $this->redirect(Url::to(['index']));            }else{                throw new Exception('上传失败~');            }        }        return $this->render('add');    }
    /**     * 刪除     * @param $id     * @return bool or string     */    public function actionDel($id){        $id = Yii::$app->request->get('id',0);        if(!$id){            echo  json_encode(['status'=>0,'message'=>'无该数据']);exit;        }        $mess = ['status'=>0,'message'=>'删除失败~'];        $curInfo = Yii::$app->db->createCommand("select * from ".$this->table_name.' where id ='.$id)->queryOne();        $image = str_replace($this->host,'/mnt/tmpfile',$curInfo['url_big']);        $res = unlink($image);//注意,删除的链接格式/mnt/tmpfile/20160503344/tete.png        if($res){             $flag = Yii::$app->db->createCommand()->delete($this->table_name,['id'=>$id])->execute();            if($flag){                $mess = ['status'=>1,'message'=>'删除成功~'];            }        }        echo  json_encode($mess);exit;    }

<!-- 引入js--><script src="/js/bootstrap-fileinput.js"></script><!-- 引入css --><style>    .btn-file {        position: relative;        overflow: hidden;        vertical-align: middle;    }    .btn-file > input {        position: absolute;        top: 0;        right: 0;        width: 100%;        height: 100%;        margin: 0;        font-size: 23px;        cursor: pointer;        filter: alpha(opacity=0);        opacity: 0;        direction: ltr;    }    .fileinput {        display: inline-block;        margin-bottom: 9px;    }    .fileinput .form-control {        display: inline-block;        padding-top: 7px;        padding-bottom: 5px;        margin-bottom: 0;        vertical-align: middle;        cursor: text;    }    .fileinput .thumbnail {        display: inline-block;        margin-bottom: 5px;        overflow: hidden;        text-align: center;        vertical-align: middle;    }    .fileinput .thumbnail > img {        max-height: 100%;    }    .fileinput .btn {        vertical-align: middle;    }    .fileinput-exists .fileinput-new,    .fileinput-new .fileinput-exists {        display: none;    }    .fileinput-inline .fileinput-controls {        display: inline;    }    .fileinput-filename {        display: inline-block;        overflow: hidden;        vertical-align: middle;    }    .form-control .fileinput-filename {        vertical-align: bottom;    }    .fileinput.input-group {        display: table;    }    .fileinput.input-group > * {        position: relative;        z-index: 2;    }    .fileinput.input-group > .btn-file {        z-index: 1;    }    .fileinput-new.input-group .btn-file,    .fileinput-new .input-group .btn-file {        border-radius: 0 4px 4px 0;    }    .fileinput-new.input-group .btn-file.btn-xs,    .fileinput-new .input-group .btn-file.btn-xs,    .fileinput-new.input-group .btn-file.btn-sm,    .fileinput-new .input-group .btn-file.btn-sm {        border-radius: 0 3px 3px 0;    }    .fileinput-new.input-group .btn-file.btn-lg,    .fileinput-new .input-group .btn-file.btn-lg {        border-radius: 0 6px 6px 0;    }    .form-group.has-warning .fileinput .fileinput-preview {        color: #8a6d3b;    }    .form-group.has-warning .fileinput .thumbnail {        border-color: #faebcc;    }    .form-group.has-error .fileinput .fileinput-preview {        color: #a94442;    }    .form-group.has-error .fileinput .thumbnail {        border-color: #ebccd1;    }    .form-group.has-success .fileinput .fileinput-preview {        color: #3c763d;    }    .form-group.has-success .fileinput .thumbnail {        border-color: #d6e9c6;    }    .input-group-addon:not(:first-child) {        border-left: 0;    }</style><form class="form-horizontal" role="form" method="post" action="<?=Url::to(['add'])?>"  enctype='multipart/form-data' >    <ul class="breadcrumb">        <li><a href="#">首页</a></li>        <li><a href="#">系统设置</a></li>        <li class="active">上传图片</li>        <a href="<?=Url::to(['index'])?>" class="btn btn-primary btn-sm pull-right">返回</a>    </ul>    <div class="form-group">        <label for="name" class="col-sm-2 control-label">名称</label>        <div class="col-sm-5">            <input type="text" class="form-control" name="name" placeholder="自定义名称">        </div>    </div>    <div class="form-group">        <label for="name" class="col-sm-2 control-label">分类</label>        <div class="col-sm-5">            <select name="type"  class="form-control">                <option value="0">请选择..</option>                <option value="1">小程序</option>                <option value="2">其他</option>            </select>        </div>    </div>    <div class="form-group " style="display:none;"  id="dir_name" >        <div class="col-sm-offset-2 col-sm-10">保存的目录:            <input type="text" name="dir_name" value="">        </div>    </div>    <div class="form-group" id="uploadForm" enctype="multipart/form-data">        <div class="col-sm-offset-2 col-sm-10">            <div class="h4">图片预览</div>            <div class="fileinput fileinput-new" data-provides="fileinput" id="exampleInputUpload">                <div class="fileinput-new thumbnail" style="width: 200px;height: auto;max-height:150px;">                    <img id="picImg" style="width: 100%;height: auto;max-height: 140px;" src="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9InllcyI/PjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTQwIiBoZWlnaHQ9IjE0MCIgdmlld0JveD0iMCAwIDE0MCAxNDAiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjwhLS0KU291cmNlIFVSTDogaG9sZGVyLmpzLzE0MHgxNDAKQ3JlYXRlZCB3aXRoIEhvbGRlci5qcyAyLjYuMC4KTGVhcm4gbW9yZSBhdCBodHRwOi8vaG9sZGVyanMuY29tCihjKSAyMDEyLTIwMTUgSXZhbiBNYWxvcGluc2t5IC0gaHR0cDovL2ltc2t5LmNvCi0tPjxkZWZzPjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+PCFbQ0RBVEFbI2hvbGRlcl8xNWViYzM4ZTYwNSB0ZXh0IHsgZmlsbDojQUFBQUFBO2ZvbnQtd2VpZ2h0OmJvbGQ7Zm9udC1mYW1pbHk6QXJpYWwsIEhlbHZldGljYSwgT3BlbiBTYW5zLCBzYW5zLXNlcmlmLCBtb25vc3BhY2U7Zm9udC1zaXplOjEwcHQgfSBdXT48L3N0eWxlPjwvZGVmcz48ZyBpZD0iaG9sZGVyXzE1ZWJjMzhlNjA1Ij48cmVjdCB3aWR0aD0iMTQwIiBoZWlnaHQ9IjE0MCIgZmlsbD0iI0VFRUVFRSIvPjxnPjx0ZXh0IHg9IjQ1IiB5PSI3NC44Ij4xNDB4MTQwPC90ZXh0PjwvZz48L2c+PC9zdmc+" alt="">                </div>                <div class="fileinput-preview fileinput-exists thumbnail" style="max-width: 200px; max-height: 150px;"></div>                <div>                        <span class="btn btn-primary btn-file">                            <span class="fileinput-new">选择文件</span>                            <span class="fileinput-exists">换一张</span>                            <input type="file" name="image" id="picID" accept="image/gif,image/jpeg,image/x-png">                        </span>                    <a href="javascript:;" class="btn btn-warning fileinput-exists" data-dismiss="fileinput">移除</a>                </div>            </div>        </div>    </div>    <div class="form-group">        <div class="col-sm-offset-2 col-sm-10">            <button type="submit"  class="btn btn-success">提交</button>        </div>    </div></form><script>    $(".btn-success").click(function () {        var name =  $('input[name="name"]').val();        if(name =='' || name == undefined){            alert('名称不能为空..')            return false;        }        $('form[role="form"]').submit();    })    $('select[name="type"]').change(function () {        var value = $('select[name="type"] option:selected').val();        if(value==2){            $('#dir_name').attr('style','display:block;');        }else{            $('#dir_name').attr('style','display:none;');        }    })</script>


原创粉丝点击