Отправка файла через Formit (Ajax) добавленный через DropFile (Dropzone, drag&drop)

Я нашел несколько тем на форуме. Перерыл много ссылок но не смог разобраться в самом главном.
Как прикрепить файлы закинутые в Dropzone к отправляемой форме?

Поменять значение input type=file нельзя по соображением безопасности.

Как вариант, можно написать отдельный обработчик, но у меня навыков точно не хватит. Я обычный верстальщик и 2 дня пытаюсь разобраться, как же мне отправить файл залитый через dropbox вместе с формой в письме?

Вот JS код, который хорошо отрабатывает и вроде видит все что получает

$('#dropzone_project').on({
	// Добавляем события на перетаскивание файла
	'dragover dragenter': function (e) {
		$('#dropzone_project').addClass('drop-hover')
		e.preventDefault()
		e.stopPropagation()
	},
	drop: function (e) {
		$('#dropzone_project').removeClass('drop-hover')
		// Получаем Трансфер файлов
		var dataTransfer = e.originalEvent.dataTransfer

		if (dataTransfer && dataTransfer.files.length) {
			e.preventDefault()
			e.stopPropagation()

			// Перебераем файлы и выводим их название в HTML разметку
			$.each(dataTransfer.files, function (i, file) {
				var reader = new FileReader()

				reader.onload = $.proxy(
					function (file, $fileList, event) {
						$fileList.prepend($('<li>').append(file.name))
					},
					this,
					file,
					$('#fileList_project')
				)

				reader.readAsDataURL(file)
			})
		}
	},
})

Как мне прикрепленные файлы добавить к письму?
Денис Мавлютов
11 января 2023, 19:01
modx.pro
732
0

Комментарии: 8

Артур Шевченко
11 января 2023, 19:10
0
Вы сейчас удивитесь, но чтобы прикрепить файл к письму отправленному через AjaxForm+FormIt не нужно делать ничего. Главное чтобы у формы был атрибут enctype=«multipart/form-data».
    Денис Мавлютов
    12 января 2023, 14:04
    0
    Это в случае, если вы прикрепляете файл через input type=«file», но значение этого input поля нельзя менять динамический или как-то из вне, вы получите ошибку в браузере о мерах безопасности.

    Я предполагаю, что можно как-то добавить к отправляемой форме файлы из dropzone.

    Еще раз. Файлы закинутые через Drag and Drop не добавляются в input и потому стандартным путем не будут добавляться к письму.

    enctype=«multipart/form-data» у меня в форме добавлен
      Артур Шевченко
      12 января 2023, 14:35
      0
      Файлы закинутые через Drag & Drop также должны добавляться в поле типа file, других способов отправить файлы с фронта просто не существует.
        Alexey
        12 января 2023, 14:43
        0
        Файлы, закинутые через dropzone, сразу попадают на сервер во временную папку, и ими можно манипулировать через отдельный php-загрузчик. И да — эти файлы в форме не прикрепляются к инпуту с типом file, так как они уже на сервере. Если, в процессе загрузки файлов обработчиком их складывать в определенную папку, то потом при помощи хука их можно прикрепить к письму. Получается, что стандартный хук mail для formIt не подходит, нужно мутить свой.

        Если не прав, сорри, пишу по памяти) Возможно, есть ещё какие-то лайт-варианты.
          Артур Шевченко
          12 января 2023, 17:56
          0
          Ну это магия какая-то, чтобы файлы сами по себе залетали на сервер))) Мои знания о том, как работает drag&drop, говорят, что должен быть input типа файл и отправка его на сервер, другое дело, что используемая библиотека может делать это каким-то неявным образом, но я не представляю как это возможно.
          Alexey
          12 января 2023, 20:51
          0
          Перечитал свой коммент и понял, что коряво сформулировал. Артур прав, конечно, файлы из js никак не могут попасть на сервер, при помощи библиотеки dropzone они отправляются по урлу, указанному в action. И уже php-обработчик их отлавливает и может залить в нужную директорию.

          Вот что я имел в виду, говоря «сразу попадают на сервер во временную папку».
Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.
8