title: Solution to RESTful file uploading in JavaScript
body: <p>My apologies if this is an inappropriate question:</p>
  
  <p><strong>My Problem</strong></p>
  
  <p>I'm creating (or attempting to create) a RESTful API for an application that utilizes file uploads primarily for use with a JavaScript client. As many of you know, there's no standard, cross-browser way to upload files using Ajax (outside of the <a href="https://stackoverflow.com/questions/3424640/upload-file-to-remote-server-using-ajax">iframe method</a>). Unfortunately, in my application uploading the file requires authentication and so there's no way to use the iframe method that couldn't potentially disrupt the UI.</p>
  
  <p>I obviously could POST to "<a href="https://username:password@myhost/resource" rel="nofollow noreferrer">https://username:password@myhost/resource</a>" but the credentials could then be saved in the browser. Making logging out very difficult.</p>
  
  <p><strong>My Solution</strong></p>
  
  <p>So MY solution is base64 encoding. Which goes as follows:</p>
  
  <ol>
  <li>Use an iframe to post file to my script (let's call it base64.php)</li>
  <li>That script converts the file to base 64 and then returns the string.</li>
  <li>The application takes the string and sends that in place of the file to my API</li>
  <li>The API takes the base 64 string and converts it back to the file.</li>
  <li>File "upload" complete </li>
  </ol>
  
  <p>Essentially, I use the iframe method to post a file to a script that takes the script, encodes it, and returns the string. I then perform my ajax request as normal using the Base64 encoded string rather then the file itself.</p>
  
  <p><strong>My Question</strong></p>
  
  <p>My question is does anyone see any problems with this solution? Is there a better way? Or is there anything I can do to improve it?</p>
  
  <p>Thanks!</p>