title: Google Drive API and file uploads from the browser
body: <p>I'm trying to upload a file with the Google Drive api, and I have the metadata correct, and I want to ensure that the actual file contents make it there. I have a simple page setup that looks like this:</p>
  
  <pre><code>&lt;div id="upload"&gt;
    &lt;h6&gt;File Upload Operations&lt;/h6&gt;
    &lt;input type="file" placeholder='file' name='fileToUpload'&gt;
    &lt;button id='uploadFile'&gt;Upload File&lt;/button&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>and I have a the javascript setup where the user is prompted to sign in first, and then they can upload a file. Here's the code: (currently only uploads the file metadata....)</p>
  
  <pre><code>let uploadButton = document.getElementById('uploadFile');
  uploadButton.onclick = uploadFile;
  const uploadFile = () =&gt; {
      let ftu = document.getElementsByName('fileToUpload')[0].files[0];
      console.dir(ftu);
      gapi.client.drive.files.create({
          'content-type': 'application/json;charset=utf-8',
          uploadType: 'multipart',
          name: ftu.name,
          mimeType: ftu.type,
          fields: 'id, name, kind'
      }).then(response =&gt; {
          console.dir(response);
          console.log(`File: ${ftu.name} with MimeType of: ${ftu.type}`);
          //Need code to upload the file contents......
      });
  };
  </code></pre>
  
  <p>First, I'm more familiar with the back end, so getting the file in bits from the <code>&lt;input type='file'&gt;</code> tag is a bit nebulous for me. On the bright side, the metadata is there. How can I get the file contents up to the api?</p>