How to make a photo uploader in the form of html?

You will need a webAPI that takes a picture and returns a link to the picture, then:

html:

<input type="file" name="file" id="file""> <img src=""/> 

js:

 $('input[type=file]').on('change', upload); function upload(event){ var data = new FormData(); $.each(event.target.files, function(key, value) { data.append(key, value); }); $.ajax({ url: 'vebapiURL', type: 'POST', data: data, success: function(success) { $('img').attr('src', success.uploadedIMGURL); } }); } 

Choose a file, send it to the server by Ajax, get a link to it from the server, update the image in the dom. Then you can do some manipulations with it, for example, add it to the canvas, and then twist, gauge and scale it.

In theory:
First, the file is sent to the server

  <form action="" enctype="multipart/form-data" method="post"> <p><input type="file" name="pic"></p> <p><input type="submit" value="отправить"></p> </form> 

Then, by clicking on the "delete" button, we send a request to the server and there we delete and in response send a new list for example =)