javascript — отправка & lt; canvas & gt; изображение в PHP с использованием JS
Я делаю несколько фотографий с помощью веб-камеры. HTML выглядит так:
<div class="camera">
<video id="video">Video stream not available.</video>
</div>
Сделанное фото отображается с помощью <canvas>:
<div class="output">
<canvas id="canvas"></canvas>
</div>
Ниже у меня есть <form> с кнопкой сохранения:
<form method="post">
<button name="savephoto">Save photo</button>
</form>
Вот как я регистрируюсь PHP если сохранить фото, нажмите кнопку: if (isset($_POST['savephoto']))
Теперь, как я мог получить фотографию (от canvas) в PHP только используя JavaScript?
Решение
Вы должны искать canvas.toDataUrl ().
Вот статья, показывающая это в использовании: https://davidwalsh.name/convert-canvas-image
Другие решения
var canvas = document.getElementById("canvas");
var img = canvas.toDataURL("image/png");
Затем добавьте его в форму с полем и опубликуйте форму с помощью JS, а на стороне php вы можете получить эту строку и добавить ее в файл.
var form = document.getElementById("formID");
var hiddenField = document.createElement("input");
hiddenField.setAttribute("name", "canvasImg");
hiddenField.setAttribute("value", img);
form.appendChild(hiddenField);
form.post();
В вашем php-файле вы можете получить строку изображения с $ _POST [‘canvasImg’] но в вашем html вы должны установить php файл в атрибуте submit.
detector