jQuary ασύγχρονα ανεβάσετε αλλά συνδυάσετε τα δύο αρχεία σε ένα μεταφόρτωσης

ψήφοι
0

Έχω μια φόρμα αποστολής αρχείων που επιτρέπει την επιλογή όσα αρχεία (μόνο .xml και .yml αρχεία), όπως θέλετε να ανεβάσετε. Το έντυπο έχει δημιουργηθεί με blueimp του jQuery File Upload . Χρησιμοποίησα τις πληροφορίες σε αυτή την ερώτηση για να πάρει τα πάντα εργασίας.

Οι .xml και .yml αρχεία έρχονται πάντα σε ζεύγη και περιέχουν διαφορετικές πληροφορίες σε ένα μπλοκ δεδομένων. Τα αρχεία που αποστέλλονται χειρίζεται ένα ξεχωριστό αρχείο .php. Εκεί μπορώ να ελέγξω αν το αντίστοιχο αρχείο έχει ήδη φορτωθεί. Αν αυτή είναι η περίπτωση που ξεκινήσει μια διαδικασία για να χειριστεί τα δύο αρχεία.

Λειτουργεί μια χαρά στις περισσότερες περιπτώσεις, αλλά μερικές φορές παίρνω ενσύρματα μηνύματα επιστροφής και μοιάζει ότι είναι δυνατόν για να ξεκινήσει η μεταγλώττιση και τη διαδικασία κωδικό δύο φορές. Υποψία μου είναι, ότι το αντίστοιχο αρχείο μόλις ολοκληρωθεί η μεταφόρτωση πριν από το πρώτο αρχείο ελέγχεται αν τα δύο υπάρχουν. Στη συνέχεια, το πρώτο αρχείο ξεκινά τη διαδικασία και το δεύτερο αρχείο ξεκινά επίσης.

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;

Για να το διορθώσετε αυτό, θα ήθελα να συνδυάσετε τα δύο αρχεία στον υπολογιστή-πελάτη και να ανεβάσετε και τα δύο αρχεία ταυτόχρονα. Για να ξαναγράφοντας το σενάριο servers PHP σαν αυτό δεν είναι πρόβλημα, αλλά πώς μπορώ να ελέγξω και η ομάδα τα αρχεία JS;

Προφανώς, θα πρέπει να καθυστερήσει var jqXHR = data.submit();στο add: function. Αλλά έχω μερικές ερωτήσεις:

  1. Πού και πώς μπορώ να αποκτήσω πρόσβαση στον πλήρη κατάλογο των επιλεγμένων αρχείων;

  2. Όταν έχετε αντιστοιχίσει τα αντίστοιχα αρχεία, πώς μπορώ να το έναυσμα για μια αποστολή δύο αρχείου;

Εδώ είναι μια μικρότερη έκδοση του εντύπου αποστολής μου:

<!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>
Δημοσιεύθηκε 24/10/2019 στις 12:53
πηγή χρήστη
Σε άλλες γλώσσες...                            

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