JSFiddle - React, Tailwind, and code Playground

by Niraj Chauhan

HTML

<script src="https://raw.github.com/chute/avatars-io-js/master/dist/avatars.io.min.js"></script>

	<script>
	var client = new AvatarsIO('eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJwcml2YXRlX3Rva2VuIjoiNGI5NjgxNTIwMzQxNjA5ZmNkNzA5Y2JiMDE0NTczNWUzMjJiM2M5ZGQ2ZDY4Zjk4NGNkZDEzYzM0NmE4MDU3MiJ9.9vhiUEQIhEYkdnwkQRVLPP4BSTgGaJF0dcpbBX50mZ4'); // obtain at http://avatars.io/
	$(function(){
	    var uploader = client.create('#avatar'); // selector for input[type="file"] field, here #avatar, for example
	    uploader.setAllowedExtensions(['png', 'jpg']); // optional, defaults to png, gif, jpg, jpeg
	    uploader.on('complete', function(url){
	        alert(url);
	    });
	});
	</script>
<input type="file" id="avatar" />