title: Unable to upload Azure Storage File Share File from browser using Rest API (JavaScript)
body: <p>I am attempting to upload a file from a browser directly to a File Share File. The <a href="https://docs.microsoft.com/en-us/rest/api/storageservices/create-file" rel="nofollow noreferrer">operation's spec</a> is pretty straight forward, send an HTTP PUT request to a URL (with a <a href="https://docs.microsoft.com/en-us/rest/api/storageservices/delegate-access-with-shared-access-signature" rel="nofollow noreferrer">SAS token</a>) along with some headers. I attempted to implement this with a simple HTML form and some backing JavaScript in this <a href="https://jsfiddle.net/acwyxzoj" rel="nofollow noreferrer">jsfiddle</a>. To my surprise the system fails, and responds XML indicating that the <code>Content-Length</code> header is incorrect:</p>
  
  <pre class="lang-xml prettyprint-override"><code>&lt;?xml version="1.0" encoding="utf-8"?&gt;
  &lt;Error&gt;
    &lt;Code&gt;InvalidHeaderValue&lt;/Code&gt;
    &lt;Message&gt;The value for one of the HTTP headers is not in the correct format.
  RequestId:XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX
  Time:0000-00-00T00:00:00.0000000Z&lt;/Message&gt;
    &lt;HeaderName&gt;Content-Length&lt;/HeaderName&gt;
    &lt;HeaderValue&gt;12345&lt;/HeaderValue&gt;
  &lt;/Error&gt;
  </code></pre>
  
  <p>I double checked the documentation, and it indicates that the <code>Content-Length</code> header should not be present, or it should have a value specifically containing <code>0</code>. I did some digging, and <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Length" rel="nofollow noreferrer">Content-Length</a> is a <a href="https://developer.mozilla.org/en-US/docs/Glossary/Forbidden_header_name" rel="nofollow noreferrer">forbidden header name</a>, which means you can't adjust the value programmatically.</p>
  
  <p>To my puzzle, using the embeddd Azure Storage Explorer within <a href="https://portal.azure.com" rel="nofollow noreferrer">Azure Portal</a> jumps through some kind of hoops in order to specify <code>Content-Length:0</code>.</p>
  
  <p>My goals are to:</p>
  
  <ul>
  <li>Use the REST API from the browser</li>
  <li>Not introduce any external libraries</li>
  <li>Not introduce any servers</li>
  </ul>
  
  <p>Is there way to use the REST API from the browser?</p>
  
  <p>Some things that I have already checked:</p>
  
  <ul>
  <li>I have tried forcing <code>Content-Length:0</code> via the <code>headers</code> property.</li>
  <li>I have ensured that CORS settings in my Azure Storage Account (for Files) have been updated to account for my browser's location.</li>
  <li>I have attempted to integrate with <a href="https://docs.microsoft.com/en-us/rest/api/storageservices/put-blob" rel="nofollow noreferrer">Blobs</a> as a comparison, which works great in the sample, but not what I am interested in for my project.</li>
  <li>I have tried working with the API out of the browser, and I have no issues sending in the same request (of course <code>Content-Length:0</code> deviates as requested by the specification).</li>
  <li>I have tried mimicking the request headers as much as possible from a recorded XHR that was made from the Azure Portal.</li>
  </ul>