Показать сообщение отдельно
  #9 (permalink)  
Старый 09.04.2019, 05:38
Аватар для Malleys
Профессор
Отправить личное сообщение для Malleys Посмотреть профиль Найти все сообщения от Malleys
 
Регистрация: 20.12.2009
Сообщений: 1,714

Сообщение от finlolo
У меня цикл перебирает все формы с такими картинками, если быть точным то цикл for. Trable в том, что он переходит на следующий шаг не дожидаясь окончания текущей итерации, в итоге пока добавляется файл происходит киш-миш.
Используйте async/await
<form id="form_0">
	<img id="list_0" src="https://picsum.photos/800/800">
</form>
<form id="form_1">
	<img id="list_1" src="https://picsum.photos/400/400">
</form>

<script src="https://cdnjs.cloudflare.com/ajax/libs/dom-to-image/2.6.0/dom-to-image.min.js"></script>
<script>
const airforms = document.querySelectorAll("form");
const urls = [];
(async () => {
	for(const airform of airforms) {
		const id = airform.id.replace("form_", "");

		const blob = await domtoimage.toBlob(document.getElementById("list_" + id));

		const formData = new FormData();
		formData.append("file", blob);

		const endPoint = "http://0.0.0.0:8080/image-upload.php";

		// отправляю файл
		const response = await fetch(endPoint, {
			method: "POST",
			body: formData
		});

		const result = await response.json();
		//записываю данные с формы в массив объектов
		//передаю массиву ссылку на файл

		if("path" in result)
			urls.push(new URL(result.path, endPoint));
	}

	// выводится массив с ссылками на уже загруженные файлы, после того как всё загрузилось
	console.log(urls);
})();

</script>


Файлы отправляются POST запросом в http://0.0.0.0:8080/image-upload.php

Файл загружается в папку upload
Сообщение от finlolo
посоветуйте, как обработать данную строку на php.
Сообщение от finlolo
чтобы сохранить на сервере.
Может тогда всё-таки сохранять в виде файла...

Файл image-upload.php
<?php

define('KB', 1000);
define('MB', 1000 * KB);
define('GB', 1000 * MB);

header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Headers: Content-Type');

$target_dir = "uploads/";
$imageFileType = $_FILES["file"]["type"];
$file_name = sha1_file($_FILES["file"]["tmp_name"]);
$extension = explode('/', $imageFileType)[1];
$target_file = $target_dir . 'image-' . $file_name . '.' . $extension;
$result['ok'] = true;

// Check if image file is a actual image or fake image
if(isset($_POST["submit"])) {
    $check = getimagesize($_FILES["file"]["tmp_name"]);
    if($check !== false) {
        $result['message'][] = "File is an image - " . $check["mime"] . ".";
        $result['ok'] = true;
    } else {
        $result['message'][] = "File is not an image.";
        $result['ok'] = false;
    }
}
// Check if file already exists
if (file_exists($target_file)) {
    $result['message'][] = "Sorry, file already exists.";
    $result['ok'] = false;
    $result['path'] = $target_file;
}
// Check file size
if ($_FILES["file"]["size"] > 5 * MB) {
    $result['message'][] = "Sorry, your file is too large.";
    $result['ok'] = false;
}
// Allow certain file formats
if($extension != "jpg" && $extension != "png" && $extension != "jpeg"
&& $extension != "gif" ) {
    $result['message'][] = "Sorry, only JPG, JPEG, PNG & GIF files are allowed.";
    $result['ok'] = false;
}
// Check if $result['ok'] is set to false by an error
if ($result['ok'] == false) {
    $result['message'][] = "Sorry, your file was not uploaded.";
// if everything is ok, try to upload file
} else {
    if (move_uploaded_file($_FILES["file"]["tmp_name"], $target_file)) {
        $result['message'][] = "The file ". basename( $_FILES["file"]["name"]). " has been uploaded.";
        $result['path'] = $target_file;
    } else {
        $result['message'][] = "Sorry, there was an error uploading your file.";
        $result['ok'] = false;
    }
}

echo json_encode($result);

Последний раз редактировалось Malleys, 09.04.2019 в 05:55.
Ответить с цитированием