PHP不使用flash来实现文件上传，兼容各种浏览器

直接上代码

前端代码：

<div class="fbpl_top_upload_img">
    <p class="title">上传照片</p>

    <div class="fbpl_center_pad2" id="criticPictures_container">
        <ul class="fbpl_top_upload_img_wrap clearfix" id="pic_container">
            <li class=" fl add_newimg">
                <p class="fileinput-button">添加图片
                    <input name="comment_image_file" id="fileupload" type="file"  multiple>
                </p>
            </li>
        </ul>

        <div class="fbpl_center_bottom">
            <lable><input type="checkbox" name="isAnonymous" id="isAnonymous" value="1"><i>匿名</i></lable>
            <input type="submit" id="btn_submit" class="fabiao" value="发表">
        </div>
    </div>
</div>

<link href="/public/css/jquery.fileupload.css" rel="stylesheet">
<script src="/public/js/fileupload/jquery.ui.widget.js"></script>
<script src="/public/js/fileupload/jquery.iframe-transport.js"></script>
<script src="/public/js/fileupload/load-image.all.min.js"></script>
<script src="/public/js/fileupload/jquery.fileupload.js"></script>
<script src="/public/js/fileupload/jquery.fileupload-process.js"></script>
<script src="/public/js/fileupload/jquery.fileupload-image.js"></script>
<script src="/public/js/jquery.placeholder.min.js"></script>

<script  type="text/javascript">
    /*global window, $ */
    $(function () {
        'use strict';
        // Change this to the location of your server-side upload handler:
        //var url = "{{ upload_url }}?resourceType=comment_image&resourceId=1";
        var url = '/commentUpload';
        $('#fileupload').fileupload({
            url: url,
            dataType: 'json',
           // imageMaxWidth:600,
            //imageMaxHeight:350,
            add: function(e, data) {
                var uploadErrors = [];
                var acceptFileTypes = /^image\/(gif|jpe?g|png)$/i;
                if(data.originalFiles[0]['type'].length && !acceptFileTypes.test(data.originalFiles[0]['type'])) {
                    uploadErrors.push('请选择图片格式上传');
                }
                if( data.originalFiles[0]['size'] > 5000000) {
                    uploadErrors.push('你选择的文件大小超过上传限制');
                }
                if(uploadErrors.length > 0) {
                    alert(uploadErrors.join("\n"));
                } else {
                    data.submit();
                }
            },
            done: function (e, data) {
                console.log(data.result);
                if(parseInt(data.result.error) == 0){
                    if($("#pic_container li").size() < 6){
                        $("#pic_container").append(
                                '<li class=" fl img_in">'
                                +'<img style="width:99px;height:99px" src="'+data.result.url+'">'
                                +'<input type="hidden" name="criticPictures[]"  value="'+data.result.url+'" />'
                                +'<div class="close">'
                                +'<img style="cursor: pointer;" src="/public/images/comment/comment_close.png">'
                                +'</div>'
                                +'</li>'
                        );
                    }else{
                        alert("你选择的文件数量超过上传限制");
                        return false;
                    }
               }
            }
        }).prop('disabled', !$.support.fileInput)
                .parent().addClass($.support.fileInput ? undefined : 'disabled');
    });
    </script>

后台代码：

$post = array();
$post['resourceType'] ='comment_image';
$post['resourceId'] = 1 ;
$post['getImageInfo'] = 'true' ;
$post['comment_image_file'] = '@'.$_FILES['comment_image_file']['tmp_name'].';filename='.$_FILES['comment_image_file']['name'].';type='.$_FILES['comment_image_file']['type'];


$ch = curl_init();
curl_setopt($ch, CURLOPT_URL,CONFIG::get('api.loupanCommentImageUpload'));
curl_setopt($ch, CURLOPT_POST,true);
curl_setopt($ch, CURLOPT_POSTFIELDS, $post);
curl_exec ($ch);
curl_close ($ch);

使用Curl的方式上传文件

转载于:https://my.oschina.net/u/1034302/blog/540174