utilisant Blueimp jQuery-File-Upload avec la forme wordpress et contact 7 télécharger le fichier

Question

J'utilise wordpress 4.8, contactform7 4.8 et jquery file upload

et en essayant d'ajouter le support de téléchargement de fichiers multiples sous forme de contact 7.

maintenant, mon script est

(function($) { 
    'use strict'; 
    var url = window.location.hostname === 'blueimp.github.io' ? 
       '//jquery-file-upload.appspot.com/' : ajax_object.ajax_url; 

    $('.wpcf7-multifile').fileupload({ 
     url: url, 
     dataType: 'json', 
     autoUpload: true, 
     acceptFileTypes: /(\.|\/)(gif|jpe?g|png)$/i, 
     maxFileSize: 99900000, 
     // Enable image resizing, except for Android and Opera, 
     // which actually support image resizing, but fail to 
     // send Blob objects via XHR requests: 
     disableImageResize: /Android(?!.*Chrome)|Opera/ 
      .test(window.navigator.userAgent), 
     previewMaxWidth: 100, 
     previewMaxHeight: 100, 
     previewCrop: true 
    }).on('fileuploadadd', function (e, data) { 
     //console.log(data.files); 
     data.context = $('<div/>').appendTo('#files'); 
     data.formData = {action : 'do_file_upload'}; 
     $.each(data.files, function (index, file) { 
      var node = $('<p/>') 
        .append($('<span/>').text(file.name)); 
      if (!index) { 
       node 
        .append('<br>') 
      } 
      node.appendTo(data.context); 
     }); 
    }).on('fileuploadprocessalways', function (e, data) { 
     var index = data.index, 
      file = data.files[index], 
      node = $(data.context.children()[index]); 
     if (file.preview) { 
      node 
       .prepend('<br>') 
       .prepend(file.preview); 
     } 
     if (file.error) { 
      node 
       .append('<br>') 
       .append($('<span class="text-danger"/>').text(file.error)); 
     } 
    }).on('fileuploadprogressall', function (e, data) { 
     var progress = parseInt(data.loaded/data.total * 100, 10); 
     $('#progress .progress-bar').css(
      'width', 
      progress + '%' 
     ); 
    }).on('fileuploaddone', function (e, data) { 
     console.log(data.result.files); 
     $.each(data.result.files, function (index, file) { 
      if (file.url) { 
       var link = $('<a>') 
        .attr('target', '_blank') 
        .prop('href', file.url); 
       $(data.context.children()[index]) 
        .wrap(link); 
      } else if (file.error) { 
       var error = $('<span class="text-danger"/>').text(file.error); 
       $(data.context.children()[index]) 
        .append('<br>') 
        .append(error); 
      } 
     }); 
    }).on('fileuploadfail', function (e, data) { 
     //console.log("upload failed"); 
     console.log(e); 
     $.each(data.files, function (index) { 
      var error = $('<span class="text-danger"/>').text('File upload failed.'); 
      $(data.context.children()[index]) 
       .append('<br>') 
       .append(error); 
     }); 
    }).prop('disabled', !$.support.fileInput) 
     .parent().addClass($.support.fileInput ? undefined : 'disabled'); 

})(jQuery); 

et voici mon UploadHandler.php.

mon html est

<p><label> Multi File<br> 
<span class="wpcf7-form-control-wrap multifile-966"><input type="file" name="multifile-966[]" size="40" class="wpcf7-form-control wpcf7-multifile multi-file" id="multi-file" multiple="multiple" aria-invalid="false"></span></label></p> 

site serveur rappel ajax est

add_action('wp_ajax_do_file_upload', 'do_file_upload'); 
add_action('wp_ajax_nopriv_do_file_upload', 'do_file_upload'); 

if (! function_exists('do_file_upload')){ 
    function do_file_upload(){ 
     $options = [ 
     'param_name' => key($_FILES) 
    ]; 
    require('server/php/UploadHandler.php'); 
    $upload_handler = new UploadHandler($options); 
    } 
} 

téléchargement de fichiers s'échoué.

journal de la console pour e en fileuploadfail événement

n.Event {type: "fileuploadfail", timeStamp: 1500289969495, jQuery112406601460352960828: true, target: input#multi-file.wpcf7-form-control.wpcf7-multifile.multi-file, isTrigger: 3…} 

réponse du réseau

{"multifile-966":[{"name":"Beautiful-Nature-Images-Wallpaper-6755.jpg","size":565592,"type":"image\/jpeg","url":"http:\/\/localhost\/contactform7\/wp-content\/uploads\/wpcf7_uploads\/Beautiful-Nature-Images-Wallpaper-6755.jpg","thumbnailUrl":"http:\/\/localhost\/contactform7\/wp-content\/uploads\/wpcf7_uploads\/thumbnail\/Beautiful-Nature-Images-Wallpaper-6755.jpg","deleteUrl":"http:\/\/localhost\/contactform7\/wp-admin\/admin-ajax.php?multifile-96=Beautiful-Nature-Images-Wallpaper-6755.jpg","deleteType":"DELETE"}]}0

réponse factice réseau prévu

{files: [,…]} 
files 
: 
[,…] 
0 
: 
{name: "46541-purple-sunrise-over-the-mountains-1920x1200-nature-wallpaper (1).jpg", size: 566874,…} 

Je converti ces réponses de deux à un tableau dans le fichier UploadHandler.php méthode de post et les deux sont 100% même !! seulement diff erence est un 0 à la fin de la réponse json, peut-être qui donne une idée, mais maintenant j'ai aucune idée pourquoi pas il montre le téléchargement de fichiers a échoué, le fichier obtiennent téléchargé mais temporairement quand je rafraîchis le page, ils disparu.

a également mis à jour: UploadHandler.php.

Mise à jour

changé

return $this->generate_response($response, $print_response); 

à

$print_response = false; 
    wp_send_json($this->generate_response($response, $print_response)); 

fait le 0 supplémentaire a disparu, mais le téléchargement est temporaire, mais comportement attendu est de télécharger être permanent.

Update2

à UploadHandler.php pour

move_uploaded_file($uploaded_file, $file_path); 

Je reçois vrai. echo var_dump(move_uploaded_file($uploaded_file, $file_path)); est true.

Answer 1

changement UploadHandler.php

ces deux lignes

'upload_dir' => dirname(dirname($this->get_server_var('SCRIPT_FILENAME'))) . '/wp-content/uploads/wpcf7_uploads/', 
      'upload_url' => $wp_content_url . 'wpcf7_uploads/', 

à tout autre dossier wpcf7_uploads à côté fait fonctionner.

je l'ai changé pour

'upload_dir' => dirname(dirname($this->get_server_var('SCRIPT_FILENAME'))) . '/wp-content/uploads/2017/wpcf7_uploads/', 
      'upload_url' => $wp_content_url . '2017/wpcf7_uploads/',