Sending file via API connector

Has anyone been able to send a file via bubbles API connector?

I have a call ‘POST [file]’ request through the API connector (using “data-binary” type) that is working with Postman but throwing an issue when implemented into bubble? any insights would be greatly appreciated, the details are below:

The response from bubble is:
Status code 400
{“success”:false,“error”:{“value”:“File type not permitted !.”}}

If anyone knows of any alternative methods of sending a file via API, it would be greatly appreciated if you could share it here!

cheers,
Ben

2 Likes

Can you share link to API Doc?

https://manual.bubble.io/core-resources/bubble-made-plugins/api-connector

I believe @Jici was referring to the destination api doc

yep, here is the destination:

swagger: “2.0”
info:
x-ibm-name: ndis-upload-file
title: NDIS Upload File
version: 2.0.0
description: Digital Partners can use the Upload Files API to share a supporting
document with NDIA
schemes:

  • https
    basePath: /ndis/2.0/upload-file
    consumes:
  • application/json
    produces:
  • application/json
    securityDefinitions:
    clientIdHeader:
    type: apiKey
    in: header
    name: X-IBM-Client-Id
    security:
  • clientIdHeader:
    x-ibm-configuration:
    testable: true
    enforced: true
    phase: realized
    paths:
    /:
    post:
    responses:
    200:
    description: “”
    schema:
    $ref: ‘#/definitions/uploadFileResponse’
    parameters:
    - $ref: ‘#/parameters/filename’
    - $ref: ‘#/parameters/Content-Type’
    - $ref: ‘#/parameters/description’
    - $ref: ‘#/parameters/note’
    - $ref: ‘#/parameters/quotation_id’
    - $ref: ‘#/parameters/process_type’
    summary: Upload file request
    description: Enables upload of a file as a supporting document. File is received
    as binary content in the http request body.
    parameters:
    • $ref: ‘#/parameters/Authorization’
      definitions:
      uploadFileResponse:
      properties:
      success:
      type: boolean
      description: success status of call
      example: “true”
      additionalProperties: false
      tags:
      parameters:
      Authorization:
      name: Authorization
      type: string
      required: true
      in: header
      description: Bearer Token
      Content-Type:
      name: Content-Type
      type: string
      required: true
      in: header
      description: Content Type eg:image/jpeg
      filename:
      name: filename
      type: string
      required: true
      in: header
      description: The Uploading file name
      description:
      name: description
      type: string
      required: false
      in: header
      description: The Uploading file description
      note:
      name: note
      type: string
      required: false
      in: header
      description: The note for the Uploading file
      quotation_id:
      name: quotation_id
      type: string
      maxLength: 80
      required: false
      in: header
      description: The quotation_id for which the Document should be attached
      process_type:
      name: process_type
      type: string
      required: false
      in: header
      description: The process_type for which the Document should be attached
      x-ibm-endpoints:
  • endpointUrl: https://test.api.ndis.gov.au/sharedservices/ndis-api-test
    type:

What are the supported document type?

File is any type, but generally pdf or image.

Header of:
Content-Type: application/pdf is often used when sending a pdf in postman and was successful, however not working in bubbles api connector.

below is the description from the destination api doc for the file:

here is the postman call which successfully sends a pdf:

and attached pdf in body:
Screen Shot 2021-05-13 at 8.30.44 am

I would interpret the documentation on the Bubble API Connector to mean they only support POST Body types of form-data or raw on top of the usual JSON. Your call requires a body type of binary, which is probably not supported by the Bubble API Connector. For files stored on Bubble’s S3 cloud the data is accessible only through Bubble’s “:encoded in base64” operator, which is definitely not what your endpoint is expecting.

If you want to send a byte or octet buffer in a POST you will have to write a custom Server Side Action that reads the base64 and buffers it back into bytes and then places the POST call inside of Bubble’s context.request function. Which itself exposes the deprecated Node.js request module.

3 Likes

were you guys able to solve this issue? am also facing the same problem and it will be very helpful if I can get a solution to this problem , please help asap if anyone of you able to figure out how to send pdf from postman to bubble.
Like when am sending name, email ,any strings i can receive them on bubble database successfully, but in case of any pdf or json response they’re showing
{

"statusCode": 400,

"body": {

    "status": "ERROR",

    "message": "Unrecognized field: type"

}

}
I have added a field resume of type file and able to upload pdfs manually at bubble, how to make it happen from postman?
@aaronsheldon @b.j.gibson @blurapps


This is a tough one because the Bubble API endpoint only accepts JSON/Text. The most architecturally expedient way around this is to serialize the binary of your file to Base 64 before you call the API. Then it can be safely incorporated into the POSTed JSON.

Once the API endpoint receives the Base 64 serialized data you will then need to create a Bubble S3 file from it and then save that to the database. I have an action for writing Bubble S3 files from Base 64. It is in the plugin called Bubble Backend Utilities, and called Write from Base 64. You can then store the returned file handle in the database.

1 Like

will i need "AWS" File uploader - Any size Plugin | Bubble plugin for bubble s3 file for the base64 string?

That looks like it is more for client side then server side. The utility I wrote is: Bubble Back End Utilities Plugin | Bubble

1 Like

Yes, I have installed that plugin you have made.


in the first entry in the field res, I have sent converted pdf to JSON base 64 response and sent from Postman , now how to use “Write from Base 64” option of your plugin as am not able to see any direct option in plugin or database.

From your res field you will need to extract the value of the JSON field data. Then in the back-end utilities use Write from Base 64 action. Put the data into the contents field and supply a name and optionally a thing to attach to.

However, ideally when calling the Bubble Data API externally you would have placed the Base 64 data directly in the res field, instead of wrapping it in JSON.

1 Like

Yes, for now just for testing a sample pdf, I have converted a pdf’s data into base64 JSON response and pasted in Postman manually


now after receiving it in bubble database, am not getting any option to call “Write from Base 64” neither at database page nor at plugin(only available actions name is written there but they’re just text), it will be very helpful if you can tell how to do it after getting response from postman on bubble database.

Oh I see. You will need to create a workflow to use the plugin actions:

  1. Building Workflows in the manual.
  2. In particular Back End Workflows may be of interest as they run on the Bubble Server.
  3. API accessing custom workflows you have written

Can you send screenshots of a sample backend workflow for reference

http://forum.bubble.io/t/re-api-connector-post-body-as-a-binary-file/172100/6?u=rowntreerob is response to similar need - a utility to make it easier for endpoints and or api connections to move binary files around among 3rd party services like AWS S3.

Related UI client code based on native html tag for file is here Note: that the server can protect credentials/ auth for 3rd party PAAS. Note: that the stream implementation on server allows it to act as a proxy ( Node.pipes ) sending the file anywhere else.

Just to update.

We needed to make a Put request while sending a binary file.

This curl

curl --location --request PUT 'https://somewhereamazing' \
--header 'Content-Type: application/octet-stream' \
--header 'Authorization: Bearer AAA' \
--data-binary '@index.html'

We were not able to send via the API connector and ended up sending to pipedream.com and then writing a bash script to send it ahead.

Thanks
ZubairLK

1 Like