繁体   English   中英

从不同的文件夹上载多个文件

[英]Upload Multiple Files From DIfferent Folders

在这里完成业余。

我几乎做概括的确切过程在这里上传PHP和HTML5多个文件。 这对我来说工作正常,我可以上传多个文件。 但是,这并不是我想要的。 这似乎我的文件必须在同一文件夹,所以我可以做这个过程

浏览->选择文件->单击接受->上传

但我想这样做是

浏览 - >选择文件(S) - >点击接受 - >点击浏览 - >选择一个文件(S) - >点击接受 - >上传。

我可以采取什么措施实现这一目标? 如果可以提供更多信息,请告诉我。

根据评论,将使用全局变量(在这种情况下,它是FormData对象的实例,而不是简单的数组)。 file选择字段和upload按钮建立了事件处理程序。 file字段的事件处理程序仅将所选文件追加到全局FormData对象,并更新html以显示到目前为止所选文件的数量。

对于事件处理程序upload按钮本身调用发送了一个非常基本的Ajax功能FormData对象服务器(在这种情况下,同一个页面,但可能是一个完全不同的脚本)

在页面顶部的PHP给出了一个如何处理一个简单的例子$_FILES数组...有完成程序服务器端需要做更多的工作-祝你好运!

<?php
    if( $_SERVER['REQUEST_METHOD']=='POST' && !empty( $_FILES ) ){
        ob_clean();

        /* 
            process the uploaded files
            --------------------------

            In the actual LIVE version you will want to check that
            each file is legitimate and of the correct type before
            saving to it's final location & possibly logging the 
            upload in the database.

            check if there were errors
            check filesize
            check filetype
            check is_uploaded_file
            check if already exists
            etc etc

            For demonstration of the upload process this script ONLY
            echoes back the details of the files uploaded.

            YOU will need to do the image processing here.... 

        */

        /* example */
        $output=array();
        $files=(object)$_FILES[ 'files' ];

        foreach( $files->name as $i => $void ){
            $name = $files->name[$i];
            $size = $files->size[$i];
            $type = $files->type[$i];
            $tmp  = $files->tmp_name[$i];
            $error= $files->error[$i];

            $output[]=array('name'=>$name,'size'=>$size,'type'=>$type);
        }
        exit( json_encode( $output ) );
    }
?>
<!doctype html>
<html>
    <head>
        <meta charset='utf-8' />
        <title>Browse multiple locations</title>
        <script>
            (function(){
                function ajax(url,payload,callback){
                    var xhr=new XMLHttpRequest();
                    xhr.onreadystatechange=function(){
                        if( this.readyState==4 && this.status==200 )callback.call( this, this.response );
                    };
                    xhr.open( 'POST', url, true );
                    xhr.send( payload );
                }

                function callback( r ){
                    /* typically this callback would do considerably more than this... */
                    console.info( r )
                }

                document.addEventListener('DOMContentLoaded',function(){
                    let fd=new FormData();
                    let oFile=document.querySelector('input[type="file"]');
                    let oBttn=document.querySelector('input[type="button"]');

                    oFile.addEventListener( 'change', function(e){
                        for( var i=0; i < this.files.length; i++ ) if( this.files[ i ].type.match( 'image/.*' ) ) fd.append( 'files[]', this.files[ i ], this.files[ i ].name );
                        document.getElementById('count').innerHTML=fd.getAll('files[]').length+' files in array';
                    },false );




                    oBttn.addEventListener( 'click', function(e){
                        if( fd.getAll('files[]').length > 0 ) ajax.call( this, location.href, fd, callback );
                    },false );

                }, false );
            })();
        </script>
    </head>
    <body>
        <form>
            <div id='count'></div>
            <input type='file' name='files' multiple />
            <input type='button' value='Upload Files' />
        </form>
    </body>
</html>

经过稍微编辑的版本已阅读您的注释...两个版本均应“按原样”运行,因此,如果您遇到错误,也许可以分享实现此代码的方式

<?php
    if( $_SERVER['REQUEST_METHOD']=='POST' && !empty( $_FILES ) ){
        ob_clean();

        /* 
            process the uploaded files
            --------------------------

            In the actual LIVE version you will want to check that
            each file is legitimate and of the correct type before
            saving to it's final location & possibly logging the 
            upload in the database.

            check if there were errors
            check filesize
            check filetype
            check is_uploaded_file
            check if already exists
            etc etc

            For demonstration of the upload process this script ONLY
            echoes back the details of the files uploaded.

            YOU will need to do the image processing here.... 

        */

        /* example */
        $output=array();
        $files=(object)$_FILES[ 'files' ];

        foreach( $files->name as $i => $void ){
            $name = $files->name[$i];
            $size = $files->size[$i];
            $type = $files->type[$i];
            $tmp  = $files->tmp_name[$i];
            $error= $files->error[$i];

            $output[]=array('name'=>$name,'size'=>$size,'type'=>$type);
        }
        exit( json_encode( $output ) );
    }
?>
<!doctype html>
<html>
    <head>
        <meta charset='utf-8' />
        <title>Browse multiple locations</title>
        <script>
            (function(){
                function ajax(url,payload,callback){
                    var xhr=new XMLHttpRequest();
                    xhr.onreadystatechange=function(){
                        if( this.readyState==4 && this.status==200 )callback.call( this, this.response );
                    };
                    xhr.open( 'POST', url, true );
                    xhr.send( payload );
                }


                document.addEventListener('DOMContentLoaded',function(){

                    let fd=new FormData();

                    const callback=function(r){
                        console.info( r )
                        let json=JSON.parse( r );
                        fd=new FormData();
                        document.getElementById('count').innerHTML=Object.keys( json ).length + ' files uploaded';
                    };

                    let oFile=document.querySelector('input[type="file"]');
                    let oBttn=document.querySelector('input[type="button"]');

                    oFile.addEventListener( 'change', function(e){
                        for( var i=0; i < this.files.length; i++ ) fd.append( 'files[]', this.files[ i ], this.files[ i ].name );
                        document.getElementById('count').innerHTML=fd.getAll('files[]').length+' files in array';
                    },false );




                    oBttn.addEventListener( 'click', function(e){
                        if( fd.getAll('files[]').length > 0 ) ajax.call( this, location.href, fd, callback );
                    },false );

                }, false );
            })();
        </script>
    </head>
    <body>
        <form>
            <div id='count'></div>
            <input type='file' name='files' multiple />
            <input type='button' value='Upload Files' />
        </form>
    </body>
</html>

很快......来处理上传。 您认为合适的更改SaveDir可以和allowed_exts。 我将在其中检查各种文件类型等更多信息,但有时间让您加强并接管...我有一只病猫照顾。

if( $_SERVER['REQUEST_METHOD']=='POST' && !empty( $_FILES ) ){
    ob_clean();

    $output=array();
    $files=(object)$_FILES[ 'files' ];

    $savedir='c:/temp/fileuploads/stack/';
    $allowed_exts=array('jpg','jpeg','png');

    foreach( $files->name as $i => $void ){
        $name = $files->name[$i];
        $size = $files->size[$i];
        $type = $files->type[$i];
        $tmp  = $files->tmp_name[$i];
        $error= $files->error[$i];

        if( $error == UPLOAD_ERR_OK ){
            $ext = pathinfo( $name, PATHINFO_EXTENSION );
            if( is_uploaded_file( $tmp ) ){
                if( in_array( $ext, $allowed_exts ) ){
                    $target = $savedir . '/' . $name;
                    $status = move_uploaded_file( $tmp, $target );
                    $output[]=$status===1 ? sprintf('The file %s was uploaded',$name) : sprintf('There was a problem uploading %s',$name);
                } else {
                    $output[]='Invalid filetype';
                }
            } else {
                $output[]='Warning: Possible file upload attack';
            }
        } else {
            $output[]='Error ' . $error;
        }
    }
    exit( json_encode( $output ) );
}

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM