Skip to content

Instantly share code, notes, and snippets.

@a-guerrero
Created October 20, 2015 15:53
Show Gist options
  • Save a-guerrero/0192a3945ba474c91627 to your computer and use it in GitHub Desktop.
Save a-guerrero/0192a3945ba474c91627 to your computer and use it in GitHub Desktop.
Access user files and their content from their machine without needing to upload to your server.

Full Article

document.getElementById('upload-file').addEventListener('change', function() {
	var file;
	var destination = document.getElementById('destination');
	destination.innerHTML = '';

	// Looping in case they uploaded multiple files
	for(var x = 0, xlen = this.files.length; x < xlen; x++) {
		file = this.files[x];
		if(file.type.indexOf('image') != -1) { // Very primitive "validation"

			var reader = new FileReader();

			reader.onload = function(e) {
				var img = new Image();
				img.src = e.target.result; // File contents here

				destination.appendChild(img);
			};
			
			reader.readAsDataURL(file);
		}
	}
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment