https://rawgit.com/blueimp/JavaScript-Load-Image/master/js/load-image.all.min.js

HTML

<script src="https://rawgit.com/blueimp/JavaScript-Load-Image/master/js/load-image.all.min.js"></script>
<script src="https://rawgit.com/blueimp/JavaScript-Canvas-to-Blob/master/js/canvas-to-blob.min.js"></script>
<h2>Select an image file</h2>
<p><input type="file" id="file-input"></p>

JavaScript

document.getElementById('file-input').onchange = function (e) {
	    loadImage(
	        e.target.files[0],
	        function (img) {
	        	img.toBlob(
		             function (blob) {
		                var form = new FormData();
		                form.append('file', blob, e.target.files[0].name);
		             }, e.target.files[0].type
		        );
	            document.body.appendChild(img);
	        },
	        {
	        	 maxWidth: 600,
	     		 canvas: true,
	     		 pixelRatio: window.devicePixelRatio,
	     		 downsamplingRatio: 0.5,
	     		 orientation: true
	     	} // Options
	    );
	};