Uploading Directly to Cloudinary Using Plain Javascript
I’ve implemented image uploading and processing enough times to desire using a service to handle it for me this time around. Enter Cloudinary, a service that appears to do just what I want: accept image uploads directly from client browsers bypassing my servers all together and serving the images up from a CDN.
They have open source javascript libraries for interfacing with their API, but their documentation is lacking unless you want to use their jQuery dependent implementation. I’m not using jQuery and want a plain JS solution. It should be as simple as using XMLHttpRequest to POST to their API right? Fortunately it is!
This solution is as simple as it gets. There’s no progress tracking, retrying, or pre-upload-optimizations and it works perfectly for what I need.
If you do want progress updates you’ll need to define an xhr.onprogress
function. See Mozilla’s XMLHttpRequest.status documentation for more info.