dongqi8114 2015-01-07 02:12
浏览 36

使用javascript在PHP上出现多个图像上传错误

i have created a native javascript code (w/o jquery) to upload using php for server side, it seems that everything is ok and going fine, but when i selected 10 or more images, not all of them are uploaded some images are having problem, here is my javascript so far:

var uploadevent = function(event) {
    event.preventDefault();
    event.stopPropagation();

    var xhr = new XMLHttpRequest();
    var data = new FormData();
    for(var i = 0; i < images.files.length; ++i) {
        data.append('images[]', images.files[i]);   
    }

        data.append('EmailAd', EmailAd);
        data.append('UserID', UserID);
        data.append('Studentnumber', Studentnumber);
        data.append('album_name', document.getElementById('hidden_album_name').value);

        var ul_album_thumbnails = document.getElementById('ul_album_thumbnails');
        var rand = Math.random().toString().split('.');
        var str = rand[1]; // need this to generate unique id
        var newli = document.createElement('li');
            newli.setAttribute('id', str);

        var display = document.createElement('div'); // div element that handles preview            
            display.style.position = "relative";
            display.style.height = "191px";
            display.style.width = "180px";
            display.style.cssFloat = "right";
            display.style.border = "1px solid #a4a4a4";
            display.style.background = "#fff";
            display.style.zIndex = '998'; // this thumbnail container should be on the top

            $(display).append("<progress id='progressBar' style='border:1px solid #a4a4a4;position:absolute;bottom:0px;width:178px;z-index:1' value='0' max='100'></progress>");
            $(display).append("<div id='progressStatus' style='position:absolute;bottom:0px;width:178px;z-index:1;text-align:right;background:transparent'></div>");

            newli.appendChild(display);
            ul_album_thumbnails.insertBefore(newli, ul_album_thumbnails.childNodes[1]);

                xhr.upload.addEventListener('progress', function(event) {
                    var percent = (event.loaded / event.total) * 100;
                        document.getElementById('progressBar').value = Math.round(percent);
                        document.getElementById('progressStatus').innerHTML = Math.round(percent) + ' %';
                }); 


                xhr.onload = function() {
                    if((typeof this.response == 'object' || typeof this.response) && this.status == 200 && this.response != '') {
                        try {
                            var $resp = JSON.parse(this.response);
                                document.body.style.overflowY = 'auto';
                                divback.removeAttribute('style');
                                $('#ul_album_thumbnails > li#' + str + ' > div').css('z-index','1');
                                $('li#' + str + ' > div').html('');

                            var newimg = document.createElement('img'), thumb = $resp.ImageUrl.replace('../', '');
                                newimg.src = 'temp_pages/image.php?nocache=nocache&width=180&height=180&cropratio=5:4&image=/prototype/' + thumb;
                                $('li#' + str + ' > div').append(newimg);

                            var strs = $resp.AlbumName; // album name
                            var divfooter = document.createElement('div');
                                divfooter.style.position = 'absolute';
                                divfooter.style.width = '180px';
                                divfooter.style.height = '50px';
                                divfooter.style.bottom = '0px';
                                $(divfooter).append("<a href='JavaScript:void(0)' style='font-family:Tahoma, Geneva, sans-serif;font-size:11px;font-weight:bold;position:relative;top:8px;left:3px;'>" + strs + "</a>");
                                $('li#' + str + ' > div').append(divfooter);
                                images.value = '';
                                document.getElementById('hidden_album_name').value = '';        

                        } catch(SyntaxError) {

                        }
                    } else {

                    }
                } // end of xmlhttprequest onload event

                xhr.open('POST', 'ajax/ajax_upload_photo_album.php', true);
                xhr.setRequestHeader('Cache-Control', 'no-cache');
                xhr.send(data);
                xhr.close();            

}

and this is my PHP

  <?php
function find($filename, $key) {

    //$x = is_file($base . $filename) ? 'true' : 'false';

    // count the number of period occurence as this return an array object
    $countp = explode('.', $filename);
    $s = (count($countp) > 2) ? end($countp) : $countp[1];
    $countp[0] = md5($countp[0]) . md5(rand()); 

        if($key == 0) {
            $filename = $countp[0] . '_' . 'thumbnail' . '.' . $s;
        } else {
            $filename = $countp[0] . '.' . $s;
        }

    return strtolower($filename);   
}

$base_url = '../user/images/albums/';
$EmailAd = $_REQUEST['EmailAd'];
$username = explode('@', $EmailAd);

$UserID = $_REQUEST['UserID'];
$Studentnumber = $_REQUEST['Studentnumber'];
$album_name = $_REQUEST['album_name'];
$base_url .= $UserID.'_'.$Studentnumber.'_'.$username[0].'/'.$UserID.'_'.$Studentnumber.'_'.$username[0].'_'.$album_name.'/';

$tmp = array();
foreach($_FILES['images']['name'] as $key => $name) {
    //$sizexy = getimagesize($w);
    $image_info = getimagesize($_FILES['images']['tmp_name'][$key]);
    $imageWidth = $image_info[0];
    $imageHeight = $image_info[1];
    $f = $base_url . $imageWidth . '_' . $imageHeight . '_' . find($name, $key);
    if($_FILES['images']['error'][$key] == 0 && move_uploaded_file($_FILES['images']['tmp_name'][$key], $f)) {
        if($key == 0) {
            $g = array('ImageUrl' => $f, 'BaseUrl' => $base_url, 'AlbumName' => $album_name, 'ImageCount' => count($_FILES['images']['name']), 'Created' => date('h:ia', filectime($base_url)));
        }
    } 
}


echo json_encode($g);

clearstatcache();

?>

is there alternative code for this?

  • 写回答

0条回答 默认 最新

    报告相同问题?

    悬赏问题

    • ¥15 一道python难题2
    • ¥15 一道python难题
    • ¥15 用matlab 设计一个不动点迭代法求解非线性方程组的代码
    • ¥15 牛顿斯科特系数表表示
    • ¥15 arduino 步进电机
    • ¥20 程序进入HardFault_Handler
    • ¥15 oracle集群安装出bug
    • ¥15 关于#python#的问题:自动化测试
    • ¥20 问题请教!vue项目关于Nginx配置nonce安全策略的问题
    • ¥15 教务系统账号被盗号如何追溯设备