Jump to content
  • 0

Struggling to send a picture to Caspio Table. Text Works fine, Picture Won't.


AndrewMcB
 Share

Question

Hey Everyone, all types or suggestions would be loved and appreciated. 

I am trying to use the V2 REST API to upload a photo into Caspio table. The code below is the only success that I have at Caspio not throwing an error at me. But the Photo gets uploaded as a long string that Caspio is unable to convert back into a photo. Any suggestions of how to get a photo into a dang table would be appreciated. I have switched the content type to everything I can imagine, and looked at all Caspio and Swagger documentation without luck. (Yes I know there are security concerns with this code, this is just to get the dang thing working)

 

<title>Photo Uploader</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<h1>Caspio File Upload</h1>
<input id="customFile" name="file" type="file" /><button id="uploadButton">Upload File</button> <script>
      // Caspio API credentials
      var clientId = "clientId ";
      var clientSecret = "clientSecret ";
      var cbIntegrationId = "cbIntegrationId ";
      var accessToken = "accessToken "
 
      // Define the caspioPostFile plugin
      $.fn.caspioPostFile = function(fData, fName) {
        // Encode the file data as a base64 string
        var fileData = window.btoa(fData);
 
        // Run POST call
        $.ajax({
          url: "https://" + cbIntegrationId + ".caspio.com/rest/v2/tables/Photos_Test/records",
          type: "POST",
          data: JSON.stringify({
            "Project_ID": "1111",
            "Inspection_Count": "1",
            "Photos": fileData
          }),
          contentType: "application/json",
          processData: false,
          cache: false,
          headers: {
            "Authorization": "bearer " + accessToken,
            "Content-Type": "application/json",
            "Accept": "application/json"
          },
          success: function(data) {
            console.log("Post Success");
            console.log(data.Result);
          },
          error: function(data) {
            console.log("Post Failure");
            console.log(data.responseJSON);
          }
        });
      };
 
      // Bind the click event to the upload button
      $("#uploadButton").click(function() {
        // Get the selected file
        var leFile = $("#customFile")[0].files[0];
        var reader = new FileReader();
 
        // Read the file data as a base64 string
        reader.readAsDataURL(leFile);
        reader.onloadend = function() {
          var fileData = reader.result;
          // Call the caspioPostFile plugin
          $(this).caspioPostFile(fileData, leFile.name);
        };
      });
    </script>
 
image.thumb.png.71ae14b797cb2cf44266c91b1c324fc9.png
Link to comment
Share on other sites

1 answer to this question

Recommended Posts

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

×
×
  • Create New...