Save an image from the img tag

I'm trying to save an image created on a tag from canvas , the detail is that I do not know how to save it and send it through AJAX and then save it in a specific location.

HTML

 <div class="col-md-5">
   <canvas id="canvas"></canvas>
   <img src="{{ asset("components/dist/img/avatar06.png") }}" id="photo" alt="photo">
</div>

JS

<script>

    $(function () {
       function takepicture() {
            canvas.width = width;
            canvas.height = height;
            canvas.getContext('2d').drawImage(video, 0, 0, width, height);
            var data = canvas.toDataURL('image/png');
            photo.setAttribute('src', data);
        }
    });
</script>

With that I keep the image that I take in the moment, now my doubt is

How do I send that photo to a PHP script in order to save the image taken?