Laravel uploading file using ajax

Question

Im используя laravel framework, у меня есть форма добавления нового элемента в базу данных, и в этой форме пользователь также может перетаскивать файл, чем индикатор выполнения, пока он не будет завершен, используя ajax для загрузки файла на сервер.

После подачи этой формы я запустить функцию «AddItem» в контроллере, и я хочу сделать/проверить:

1. Файл уже размещенный в сервере (успешной загрузки)

2. Если файл размещен на сервере, как его найти? (я дал ему случайное имя)

3. Если пользователь решил не отправлять форму, я хочу удалить этот файл с сервера, поэтому у меня не будут файлы, которые не связаны с каким-либо элементом в моей базе данных.

Можете ли вы предложить мне идеи, как выполнить эти задачи?

Answer 1

Для передачи файлов с помощью AJAX вы должны использовать FormData, который является классом XMLHttpRequest2, он не работает с IE < 10.

Вам также нужно AJAX2, чтобы показать прогресс.

ОБРАЗЕЦ ФОРМЫ ВВЕСТИ С ФАЙЛАМИ И ПРОГРЕСС VIA AJAX:

Здесь я привел пример. В этом примере форма отправляет данные и файлы через AJAX с использованием FormData и показывает процент выполнения загрузки в #progress с использованием события progress. Очевидно, что это образец, и его можно было изменить, чтобы адаптировать его.

$('form').submit(function(e) { // capture submit 
    e.preventDefault(); 
    var fd = new FormData(this); // XXX: Neex AJAX2 

    // You could show a loading image for example... 

    $.ajax({ 
     url: $(this).attr('action'), 
     xhr: function() { // custom xhr (is the best) 

      var xhr = new XMLHttpRequest(); 
      var total = 0; 

      // Get the total size of files 
      $.each(document.getElementById('files').files, function(i, file) { 
        total += file.size; 
      }); 

      // Called when upload progress changes. xhr2 
      xhr.upload.addEventListener("progress", function(evt) { 
        // show progress like example 
        var loaded = (evt.loaded/total).toFixed(2)*100; // percent 

        $('#progress').text('Uploading... ' + loaded + '%'); 
      }, false); 

      return xhr; 
     }, 
     type: 'post', 
     processData: false, 
     contentType: false, 
     data: fd, 
     success: function(data) { 
      // do something... 
      alert('uploaded'); 
     } 
    }); 
}); 

Посмотрите, как работает !!: http://jsfiddle.net/0xnqy7du/3/

Laravel:

В laravel вы можете получить файл с Input::file, переместить в другое место и сохранить в базе данных, если вам это нужно:

Input::file('photo')->move($destinationPath, $fileName); 

// Sample save in the database 
$image = new Image(); 
$image->path = $destinationPath . $fileName; 
$image->name = 'Webpage logo'; 
$image->save();