rest api Submitting Files using Rest API v2 in jQuery Ajax: how does it work?

[teltz]

Hi there!

I'm trying to create a submission page in which part of includes the option to submit a file. I am able to use the API to submit normal text info (dates/numbers/prices/etc.), but submitting files is some what of an issue. Currently, this is what I have:

The code that retrieves the file and calls the API request

leFile = $('#customFile')[0].files[0];
var formData = new FormData();
console.log("form data: " + $.type(formData))
var blob = new File([leFile], leFile.name, {type: leFile.type})
formData.append('file', blob);
$(this).caspioPostFile(formData,leFile.name,leFile.type);

The API request itself:

$.fn.caspioPostFile = function(fData,fName){
        //Get access token
        console.log($.type(fData));
        $.post(
            "https://" + cbIntegrationId + ".caspio.com/oauth/token",
            {
                grant_type: "client_credentials",
                client_id: clientId,
                client_secret: clientSecret
            },
            function(cbAuth){
                //Run POST call
                $.ajax({
                    url: "https://" + cbIntegrationId + ".caspio.com/rest/v2/files",
                    type: 'POST',
                    data: fData,
                    processData: false,
                    cache: false,
                    headers: {
                        "Authorization": "Bearer " + cbAuth.access_token,
                        "Content-Type": "application/json",
                        "Accept": "application/json",
                        "Content-Disposition": "attachment; filename="+fName
                    },
                    dataType: 'json',
                    success: function (data) {
                        console.log("Post Success")
                        console.log(data.Result);
                    },
                    error: function(data) {
                        console.log("Post Failure")
                        console.log(data.responseJSON);
                    }
                });
            }
        ); 
    };

 

Now before I get this as a response, yes I have viewed almost every page on Caspio's site for documentation on rest API v2 and v1, but the problem is that none of it has any concrete examples of code for making this request in v2. The swagger site and its documentation also doesn't help my case for the same reason. I have switched the content-type from application/json to multipart/form-data and back, I have attempted adding Access Control headers, but all of it results in a failed request (returning POST 400, POST 415, or an issue with CORS policy). Does anyone know what I'm doing wrong, or has an example that I could potentially pull from?

[aaronthesoftwaremechanic]

Im just attempting to help but dont quite have time for a full solve,

Your post headers should be
'Content-Type': 'multipart/form-data' 

not "Content-Type": "application/json",
https colon  slash slash 
your caspio /rest/swagger#/Files/FilesV2_UploadFiles
 

shows an example using curl, here is a redacted version 

curl -X 'POST' \
  'mycaspio.caspio.com/rest/v2/files' \
  -H 'accept: application/json' \
  -H 'Content-Type: multipart/form-data' \
  -H 'Authorization: bearer myBearerHere' \
  -F 'File=@myfile2.pdf;type=application/pdf'

what i would do from here is attempt this in postman,
after that look into how to create an upload file button/input
likely it would go from local storage to caspio.

also, I am not sure id want to do this in a datapage, becasue your credentials would be very easily viewed. hope your storing your credentials in a server somewhere.