PHPはflashを使わないでファイルのアップロードを実現して、各種のブラウザと互換性があります

5016 ワード

ダイレクトコード
フロントエンドコード:
<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("
"));                 } 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でファイルをアップロードする