title: Upload an image file to azure blob storage from js
body: <p>I'm trying to upload an image file from an html page to azure blob storage. So far I have written a web service to create an SAS for my blob container. From this I have created a uri of the format "blob address" / "container name" / "blob name" ? "sas". I have an upload control on my html page. </p>
  
  <p>I have then tried to upload the file using the following code:</p>
  
  <pre><code>var xhr = new XMLHttpRequest();
  xhr.upload.addEventListener("progress", uploadProgress, false);
  xhr.addEventListener("load", uploadComplete, false);
  xhr.addEventListener("error", uploadFailed, false);
  xhr.addEventListener("abort", uploadCanceled, false);
  xhr.open("PUT", blobPath);
  xhr.send(upFile.files[0]);
  </code></pre>
  
  <p>where blobPath is the uri as above and upFile is my html upload control.</p>
  
  <p>When I try to upload a file the uploadFailed routine is triggered. So:
  Is this the right way to do this?
  How do I trap the error returned by the upload so that I can see what is going wrong?</p>
  
  <p>My sas looks like: "sr=c&amp;si=mypolicy&amp;sig=onZTE4buyh3JEQT3%2B4cJ6uwnWX7LUh7fYQH2wKsRuCg%3D"</p>
  
  <p>Any help appreciated, thanks.</p>