Sending an attachment from Adalo to Xano

In this guide, we'll learn how to send attachments or files to an external API from Adalo using Xano as the backend service. We'll create an API endpoint in Xano to receive the file and store it in the Xano database. Then, we'll set up a custom action in Adalo to send the file to the Xano API.

Step 1: Create an Attachment Field in Xano

1. In your Xano project, navigate to the table where you want to store the attachments.
2. Add a new field of type "Attachment" to the table. For this example, we'll name the field "file".

Step 2: Create an API Endpoint in Xano

1. In the Xano interface, go to the "APIs" section and click "Add API Endpoint".
2. Select the "Upload Content" option, and then choose "Attachment" as the content type.
3. Click into the newly created endpoint to customize it.
4. Add an "Add Record" action to store the uploaded attachment in your database.
5. Map the "file" field (the attachment field you created earlier) to the input variable representing the uploaded file.

Step 3: Set Up a Custom Action in Adalo

1. In your Adalo app, add a file uploader component and a button to trigger the custom action.
2. From the button's actions, click "Add Action" and select "Custom Action".
3. Choose the "Create" option, as we'll be creating a new record in the Xano database.
4. When prompted for the API base URL, copy and paste the URL from your Xano project.
5. Set the method to "POST".
6. Add an input field of type "Text" to hold the file data. Xano accepts Base64-encoded file URLs as input.
7. Copy the example JSON body from the Xano API endpoint and paste it into the "Body" field in Adalo.
8. Replace the value inside the quotation marks with the magic text for the file uploader input you added earlier.
9. Run a test setup to ensure the custom action is configured correctly.
10. Save the custom action.

Step 4: Preview and Test

1. In the Adalo preview mode, upload a file using the file uploader component.
2. Click the button to trigger the custom action, which will send the file to the Xano API.
3. Switch back to the Xano interface and navigate to the table where you added the attachment field.
4. You should see the uploaded file listed as a new record in the table.
5. Click on the attachment to download and verify that the file was successfully uploaded and stored.

By following these steps, you can seamlessly send attachments or files from your Adalo app to an external API powered by Xano. Xano simplifies the process of building and managing the backend infrastructure, allowing you to focus on the front-end development and user experience.