Загрузка изображений с камеры на сервер?

Question

[Erouech]

Добрый день, возникла такая интересная проблема. При загрузке уже имеющийся картинки в форму, и отправке её на сервер всё работает нормально.
А вот при загрузке только что сфотканной с телефона картинки (что то вроде: выбрать файл > сфоткать > ок) Всё идет не по плану.
Если не создавать экземпляр класса \Image, то php метод видит файлы, но если я его создаю - то он их внезапно не видит.
\Image - Intervention Image (image.intervention.io)
Вот метод принимающий фото из формы

public function updatePhoto(Request $request){
		if ($request->hasFile('photo')) {
			Log::info('file exist: '.\Auth::id());
		}else{
			Log::info('file not exist: '.\Auth::id());
		}
		
		$img = \Image::make($request->file('photo'));
		// ...

Вот сама форма

<input id="updatePhotoFile" type="file" accept="image/*" style="display:none">
<div class="recoverLink" id="update-photo">Изменить фото</div>

И наконец скрипт отправляющий фото на сервер

updatePhoto = function(photo){
    let xhr = new XMLHttpRequest();
    let data = new FormData();
    data.append("photo", photo);
    xhr.open('POST', '/ajax/update-photo', false);
    xhr.setRequestHeader('X-CSRF-Token', $('meta[name="csrf-token"]').attr('content'));
    xhr.send(data);
    if (xhr.status != 200) {
      return xhr.status + ': ' + xhr.statusText;
      alert('err')
    } else {
      return xhr.responseText;
    }
}

$( "#update-photo" ).on( "click", function() {
    $( "#updatePhotoFile" ).trigger( "click" );
});

$('#updatePhotoFile').change(function() {
    let photo;
    if(photo = updatePhotoFile.files[0]){
    let result = JSON.parse(updatePhoto(photo)); // post ajax 
        console.log(result)
    }
});

[2020-09-20 13:18:27] production.INFO: file exist: 58  // PC
[2020-09-20 13:18:51] production.INFO: file exist: 58  // PHONE - не создавая экземпляр \Image
[2020-09-20 13:19:10] production.INFO: file not exist: 58  // PHONE - Создавая экземпляр \Image

Кто сталкивался с подобным, прошу помочь.

Comments

[Daria Motorina]

Логи ведь показывают "файл не найден" на уровне строки
$request->hasFile('photo')), а работа с файлом уже вторична. Нужно дебажить этот момент со стороны джс и пхп

[Erouech]

Daria Motorina, В логах код был вот таким:

public function updatePhoto(Request $request){
		if ($request->hasFile('photo')) {
			Log::info('file exist: '.\Auth::id());
		}else{
			Log::info('file not exist: '.\Auth::id());
		}
		
		$img = \Image::make($request->file('photo'));

И скорее всего ты прав, наверное что то не так в js написано, но моих знаний недостаточно что бы самому понять.
И у гугла знаний не особо по этому вопросу(

[Daria Motorina]

Erouech, сначала отдебажьте вывод $_FILES в самом начале метода обновления фото, а потом уже можно смотреть, почему джс не подхватывает файл, если проблема только в джс

[Erouech]

Daria Motorina, Проблема в кэше, после команды cache:clear у artisan, всё загружается как положено, но только один раз

Answer 1

[Надим]

После прикрепления фотки посмотрите, что там в инпуте на стороне клиента, вдруг каких-то параметров не хватает или фотка имеет нулевой размер. Если на первый взгляд все в порядке, попробуйте форму отправлять не аяксом, а обычным способом. Если даже это не поможет, тогда вижу два решения в лоб: отправить файл строкой или упаковать его сначала в zip архив перед отправкой и отправлять уже сам архив. Для генерации архива на стороне браузера можно использовать плагин JSZip, он вам выдаст Blob который уже можно спокойно переслать на сервер аяксом.