Dropzone постит дважды (multer + dropzone)
После сабмита "из" dropzone получаю два пост запроса. Первый с undefined вместо файла, второй с файлом, но редирект во втором случае не работает.
<form id="adder" class="dropzone" enctype="multipart/form-data" action="/result/" method="post">
<input id="img" name="file" type="file" accept="image/*">
<button type="submit" class="btn btn-primary" id="submit-button">Submit</button>
</form>
$(document).ready(function () {
var myDropzone = Dropzone.forElement("#adder");
Dropzone.options.adder = {
paramName: "file",
addRemoveLinks: true,
maxFilesize: 5
};
$("#submit-button").on("click", function (e) {
myDropzone.processQueue();
})
});
И код роутера
router.post('/', upload.single('file'), async (req, res, _next) => {
console.log(file);
res.redirect(`/?file=${file}`);
}
Выводит:
> undefined
> {
fieldname: 'file',
originalname: '2421474.png',
encoding: '7bit',
mimetype: 'image/png',
destination: 'images/',
filename: '981201c866febc697b3c7ac1fa685895',
path: 'images\\981201c866febc697b3c7ac1fa685895',
size: 22006
}
И редиректит на /?file=undefined
Пробовал проверять req.file на undefined
if (typeof (req.file) !== "undefined") {
var file = req.file;
console.log(file);
res.redirect(`/?file=${file}`);
}
Тогда просто не редиректит, а уходит в "вечную загрузку", после чего выдает ошибку "Не удается получить доступ к сайту" на url /result/
Пробовал "остановливать передачу события", тогда просто не редиректит.
Ответы (1 шт):
Проблема с двумя запросами к серверу решается отключением сабмита формы, например, приостановкой передачи события submit и/или click.
e.preventDefault();
А переадресация не выполняется так как сама загрузка файла происходит с помощью ajax. Замените вызов res.redirect на res.json(file), а в обработчике Dropzone словите информацию о файле и загрузите страницу с нужным адресом, примерно так window.location.href = '/?file=${file.filename}'