jQuary încărcați asincronă, dar împerechea două fișiere într-o singură încărcare

voturi
0

Am un formular de încărcare fișier care permite selectarea cât mai multe fișiere (numai fișiere .xml și .yml) așa cum doriți să le încărcați. Formularul este creat cu blueimp lui jQuery Încărcare fișier . Am folosit Informațiile în această întrebare pentru a obține totul de lucru.

De .xml și .yml fișierele vin întotdeauna în perechi și conțin informații diferite la un bloc de date. Fișierele încărcate sunt gestionate de un fișier .php separat. Acolo am verifica dacă fișierul corespunzător este deja încărcat. Dacă acesta este cazul să înceapă un proces să se ocupe de ambele fișiere.

Acesta funcționează bine, în cele mai multe cazuri, dar, uneori, primesc mesaje de returnare prin cablu și se pare că este posibil să se înceapă codul parse și procesul de două ori. suspiciunea mea este, că fișierul corespunzător tocmai a terminat încărcarea înainte de primul fișier verificat dacă ambele există. Apoi, primul fișier începe procesul, iar al doilea fișier începe, de asemenea.

function process_uploaded_data(&$response, $file_path) {
    $file_name = get_file_name($file_path);
    $yml_path = 'tmp/'. $file_name .'.yml';
    $xml_path = 'tmp/'. $file_name .'.xml';

    if(file_exists($xml_path) && file_exists($yml_path))
    {
        // parse and process yml and xml
    }
}

// A list of permitted file extensions
$allowed = array('xml', 'yml');

if(isset($_FILES['upl']) && 0 >= $_FILES['upl']['error']){

    $extension = pathinfo($_FILES['upl']['name'], PATHINFO_EXTENSION);

    if(!in_array(strtolower($extension), $allowed)) {
        $response['file'] = $_FILES['upl']['name'];
        $response['status'] = 'failed';
        echo json_encode($response);
        exit;
    }

    if(move_uploaded_file($_FILES['upl']['tmp_name'], 'tmp/'.$_FILES['upl']['name'])){
        $response['file'] = $_FILES['upl']['name'];
        $response['status'] = 'success';

        process_uploaded_data($response, 'tmp/'.$_FILES['upl']['name']);

        echo json_encode($response);
        exit;
    }
}

echo '{status:error}';
exit;

Pentru a remedia acest lucru, aș dori pentru a asocia cele două fișiere de pe client-side și încărcați ambele fișiere simultan. Pentru a rescrie scriptul servere PHP ca acest lucru este nici o problemă, dar cum pot verifica și grupa fișierele din JS?

Evident, trebuie să întârzie var jqXHR = data.submit();în add: function. Dar am câteva întrebări:

  1. Unde și Cum pot obține acces la lista completă a fișierelor selectate?

  2. Când am împerecheat fișierele corespunzătoare, cum pot declanșa o încărcare în două fișier?

Aici este o versiune mai mică a forma mea de încărcare:

<!DOCTYPE html>
<html>
<head>
    <script src=javascripts/modernizr.js></script>
    <script src=javascripts/respond.min.js></script>
    <script src=javascripts/prefixfree.min.js></script>
    <script src=javascripts/jquery-3.4.1.min.js></script>

    <script src=javascripts/vendor/jquery.ui.widget.js></script>
    <script src=javascripts/jquery.iframe-transport.js></script>
    <script src=javascripts/jquery.fileupload.js></script>

    <script>
        $(function() {
            var ul = $('#upload ul');

            $('#upload').fileupload({
                url: 'sql_upload.php',
                dataType: 'text',
                type: 'post',

                // This function is called when a file is added to the queue
                add: function (e, data) {                   
                    //This area will contain file list and progress information.
                    var tpl = $('<li><p class=file_name></p></li>');

                    // Append the file name and file size
                    tpl.find('p').text(data.files[0].name);

                    // Add the HTML to the UL element
                    data.context = tpl.appendTo(ul);

                    // Automatically upload the file once it is added to the queue
                    var jqXHR = data.submit();
                },
                success: function(php_script_response){
                    console.log(php_script_response);
                }
            });
        })
    </script>
</head>
<body>
    <form id=upload enctype=multipart/form-data>
        <input type=file name=upl multiple />
        <ul id=fileList>
            <!-- The file list will be shown here -->
        </ul>
    </form>
</body>
</html>
Întrebat 24/10/2019 la 12:53
sursa de către utilizator
În alte limbi...                            

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more