TP5使用uploadify实现图片上传

使用uploadify实现图片上传
uploadify官网

通过官网，我们将其下载下来，放到public/static中，修改uploadify.css 中的background: url('./uploadify-cancel.png') 0 0 no-repeat; 如果路径不对，则修改。随后加载uploadify.css 和jquery.uploadify.min.js
代码实例

<!-- 前端代码   -->

  {load href="__STATIC__/admin/uploadify/uploadify.css" /}
<div class="row cl">
              <label class="form-label col-xs-4 col-sm-2">缩略图：</label>
              <div class="formControls col-xs-8 col-sm-9">
                <input id="file_upload"  type="file" multiple="true" >
                <img style="display: none" id="upload_org_code_img" src="" width="150" height="150">
                <input id="file_upload_image" name="logo" type="hidden" multiple="true" value="">
              </div>
        </div>

{load href="__STATIC__/admin/uploadify/jquery.uploadify.min.js" /}
{load href="__STATIC__/admin/js/image.js" /}
<script>
 var SCOPE = {
    'uploadify_swf' : '__STATIC__/admin/uploadify/uploadify.swf',
    'image_upload' : '{:url('api/image/upload')}',
 };
</script>

通过创建的image.js，来异步调用

$(function() {
    $("#file_upload").uploadify({
        'swf'             : SCOPE.uploadify_swf,
        'uploader'        : SCOPE.image_upload,
        'buttonText'      : '上传图片',
        'fileTypeDesc'    : 'Image files',
        'fileObjName'     : 'file',
        'fileTypeExts'    : '*.gif; *.jpg; *.png',
        'onUploadSuccess' : function(file, data, response) {
            console.log(file);
            console.log(data);
            console.log(response);
            if(response) {
                var obj = JSON.parse(data);
                $("#upload_org_code_img").attr("src", obj.data);
                $("#file_upload_image").attr("value", obj.data);
                $("#upload_org_code_img").show();
            }
        }
    });

再通过异步调用中的路径，写php处理

<?php
namespace app\api\controller;
use think\Controller;
use think\Request;
use think\File;
class Image extends Controller
{
    public function upload(){
        $file=Request::instance()->file('file');
        //给定一个目录
        $info=$file->move('upload');
        if($info && $info->getPathName()){
            return show(1,'success','/'.$info->getPathName());
        }
        return show(0,'upload error');
    }
}