irishmann

Все, что попало в интернет – остается там навсегда!

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

Но вот думаю: А не слишком ли "крутым" я стану?

btn_send.addEventListener('click',async() => {
    let blob = await new Promise(resolve => canvasElem.toBlob(resolve, 'image/png'));
    let formData = new FormData(); // Создаем объект формы для наполнения данными, словно мы работаем с тегом form в html.
    formData.append('canvas_field', blob, 'canvas.png'); // это эквивалент тому, что в нашей html форме создаем поле input type="file" name="canvas_field" value="canvas.png" и прикрепляем туда содержимое blob (метод append сам расшаривает blob, дополнительных преобразований не требуется). Естественно, на DOM-дереве это никак не отразится, это модель формы в памяти JS.
    let response = await fetch('web_tp_word.php', {
    method: 'POST',
    body: formData // для fetch не нужно дополнительных параметров, чтобы объяснить как работать с formData. Идеально, чтобы завернуть файл в форму и отправить на сервер.
    });
});

var_dump($_FILES['canvas_field']); // Сервер при вызове скрипта сложит данные файла во временный файл, а как их получить - в $_FILES. Далее можно обрабатывать всеми теми способами, предназначенные для работы с $_FILES. И после уже неважно, как их сгенерировали на клиенте.