Forum Discussion

KelechiKelechi's avatar
KelechiKelechi
Qrew Trainee
8 years ago

Upload base64 PDF File Attachment using API

I am having issue with uploading a PDF file attachment using quickbase API.
I have already converted the PDF File to base 64. After the record gets updated in quickbase, I get an error whenever i try to download the file.

Sample API Call
Headers:
Content-Type: application/xml
QUICKBASE-ACTION: API_EditRecord
Body:
<qdbapi>
  <apptoken>app_token</apptoken>
  <ticket>ticket</ticket>
  <rid>30</rid>
  <field fid="80" filename="test.pdf">
     BASE 64 ENCODED STRING OF THE PDF FILE
  </field>
</qdbapi>

What is wrong with base64 for PDF file attachments in quickbase using the API or are there specific files that quickbase can be able to decode correctly.

Or if there is another alternative approach. Thanks

FYI, I am currently using a Restlet Client - REST API Testing to do the testing to ensure the api works well, before diving in to code in any language
  • I've never used Reslet - but I haven't had any problems doing this with Postman.  Is it possible the encoding is incorrect?
    Also if you're only updating the file attachment field you can use the API_UploadFile call (although the syntax of the two calls is the same).  If you can post a small base64 encoded document I can run a quick test with postman to see if it works for me.
    Neil
  • To reliably upload files to QuickBase don't use the API and don't use any addon or external service.

    Use the FormData and the Fetch API (features which are already in your browser) and hijack QuickBase's non-API method a=FinishEditRecord.

    This tiny fragment of code is all you need to upload a file selected through an <input type=file name=_fid_6> element:

    Pastie Database
    https://haversineconsulting.quickbase.com/db/bgcwm2m4g?a=dr&rid=594


    The following screenshots demonstrate that you can use this code to upload a selected file using script WITHOUT pressing the green SAVE button:



    Note the console is displaying the Response URL ?a=dr for the newly created record containing the file attachment filed seen below:



    Also note that I am just borrowing QuickBase's form which happens to have a  <input type=file name=_fid_6> element on it. The code in no way need to use QuickBase's form - you can do the same thing by just dropping the <input type=file name=_fid_6>onto a code page and incorporating the short script I listed above..

    FormData Info
    https://developer.mozilla.org/en-US/docs/Web/API/FormData

    Fetch API Info
    https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API

    All things considered (including the current state of QuickBase's architecture), every other solution is inferior to this method. STOP doing things the old way and use script for everything you can. There has been so much enormous progress made with browser technologies that you will simply not be participate in this revolution if you do not avail yourself of the cornucopia of technology already installed on your device.
    • KelechiKelechi's avatar
      KelechiKelechi
      Qrew Trainee
      Thanks for this new approach and I will definitely try it out.
    • _anomDiebolt_'s avatar
      _anomDiebolt_
      Qrew Elite
      FWIW, the Fetch API is the future - say goodbye to XMLHttpRequest.or jQuery's AJAX methods. Fetch when used with FormData can be used to programmatically create/clone and submit any QuickBase form (or your own version of a form). Submitting a file programmatically it just one tiny use of Fetch and FormData.

      BTW, Service Workers exclusively uses Fetch and you should too.

    • CalvinLe_Mottee's avatar
      CalvinLe_Mottee
      Qrew Member

      Hey, 

      I appreciate your detailed post but I can't seem to get it to work. Upon submitting the form I am getting an error, i.e. time limit on the previous page has expired. 

      My use case is to allow a user on the mobile app to upload an image via a custom page. 

      I have tried the 'application/xml' API which was able to work when the page was opened via the QuickBase web application. It however did not work when I tried it on the mobile app. I suspect this is due to a CORS error.

      Any suggestions would be appreciated?



      ------------------------------
      Calvin Le Mottee
      ------------------------------
  • Just in case you don't go with Dan's solution - here's the issue.  The instruction say NO carriage returns in the data - so you need to change this:

     <field fid="80" filename="test.pdf">
         BASE 64 ENCODED STRING OF THE PDF FILE
      </field>

    To this:

     <field fid="80" filename="test.pdf">BASE 64 ENCODED STRING OF THE PDF FILE</field>

    I just tested this in postman and it worked fine when I eliminated the hidden characters around the field tags.
    Good luck..
    Neil
    • KelechiKelechi's avatar
      KelechiKelechi
      Qrew Trainee
      I followed your solution and removed the carriage return and it works fine.
      Thank you very much
    • JoshuaTate's avatar
      JoshuaTate
      Qrew Cadet
      Glad you solved your problem but Dans advice is extremely sound, you may want to modernize the code you use if not for any other reason that to keep up with latest web standards :)