wapuploader上传图片

1.html

<div class="col-sm-8">
    <input type="hidden" name="imagevalue" value="" id='imagevalue'>
    <div id="uploader" class="wu-example">
        <!--用来存放文件信息-->
        <div id="imagecontent" class="uploader-list"></div>
        <div class="btns">
            <div id="picker">选择文件</div>
        </div>
    </div>
</div>

2.js

var uploader = WebUploader.create({
    auto: true,
    fileVal:'image',
    swf: '/static/admin/default/js/plugins/webuploader/Uploader.swf',
    server: '/admin/uploading/images',
    pick: '#picker',
    resize: false,
    accept: {
        title: 'Images',
        extensions: 'gif,jpg,jpeg,bmp,png',
        mimeTypes: 'image/*'
    }
});
uploader.on('uploadProgress', function(file, percentage) {
    console.log(file);
    console.log(percentage);
    var $li = $('#'+file.id),$percent = $li.find('.progress span');
    // 避免重复创建
    if (!$percent.length) {
        $percent = $('<p class="progress"><span></span></p>').appendTo($li).find('span');
    }
    $percent.css('width', percentage * 100 + '%');
});
uploader.on('uploadSuccess', function(res) {
    console.log(res);
    $("#imagevalue").val(res.data);
    $("#imagecontent").html('<img src="'+res.data+'" width="200" height="150">');
});
uploader.on('uploadError', function(res) {
    layer.msg("网络错误，请重试");
});
uploader.on('uploadComplete', function(res) {
    console.log(file);
    $( '#'+file.id ).find('.progress').remove();
});

如果uploader的div是隐藏元素，则在显示时，调用

uploader.refresh();

3.php

public function images()
{
    $file = request()->file('image');
    if(!$file){
        echo json_encode(['code'=>0,'msg'=>'error','data'=>'error']);
        exit;
    }
    $info = $file->move( './uploads');
    if($info){
        // 判断文件是否已经上传过了
        $res = Db::name('resources')->where('resmd5sha1',$info->md5().$info->sha1())->find();
        if($res){
            @unlink(CMS_PATH.'/uploads/'.$info->getSaveName());
            echo json_encode(['code'=>1,'msg'=>'success','data'=>$res['respath']]);
            exit;
        }else{
            Db::name('resources')->insertGetId(['respath'=>'/uploads/'.$info->getSaveName(),'resmd5sha1'=>$info->md5().$info->sha1(),'addtime'=>time()]);
            echo json_encode(['code'=>1,'msg'=>'success','data'=>'/uploads/'.$info->getSaveName()]);
            exit;
        }
    }else{
        echo json_encode(['code'=>0,'msg'=>'error','data'=>$file->getError()]);
        exit;
    }
}

本文为看恩吧原创文章,转载无需和我联系,但请注明来自knsay.com

打赏

• 上一篇： 08tomcat
• 下一篇： linux性能瓶颈分析