title: Direct Upload to Cloudinary from Browser Bad Request
body: <p>i'm getting a 400 bad request error when trying to upload to cloudinary with the following code:</p>
  
  <pre><code>$("input.cloudinary-fileupload[type=file]").cloudinary_fileupload();
  $.cloudinary.config({"api_key":"6586856745648955","cloud_name":"some-cloud"});
  
    $http.get("http://localhost:3000/story/secret")
    .then(function(res){
      var CLOUD_API_SECRET = res.data.CLOUD_API_SECRET;
      var obj =
      {
        "timestamp":  Date.now(),
        "callback": "http://localhost:3000/cloudinary_cors",
        "signature": CLOUD_API_SECRET,
        "api_key": "6586856745648955"
      };
      // var data = JSON.stringify(obj);
      $("input[type='file']").attr('data-form-data', obj);
    })
    .catch(function(err){
      console.log("error: ", err);
    });
  </code></pre>
  
  <p>with my front containing the following:</p>
  
  <pre><code>&lt;input name="file" type="file"
      class="cloudinary-fileupload" data-cloudinary-field="image_upload"
      data-form-data=" ... html-escaped JSON data ... " &gt;
  &lt;/input&gt;
  </code></pre>
  
  <p>i've also tried to stringify, then encode the "obj" variable and plug that in like so: </p>
  
  <pre><code>var data = JSON.stringify(obj);
  $("input[type='file']").attr('data-form-data', encodeURI(data));
  </code></pre>
  
  <p>i get the same error.</p>
  
  <p>i'd appreciate any help or suggestions. thanks a bunch.</p>