This document walks you through posting a form with a file payload from a Zesty.io website to a remote PHP server that will capture the information, store the file to a temporary directory, then send that information to a dynamic spreadsheet on Airtable.com, and return back to the Zesty.io website. This tutorial expects you to have a Zesty.io site ready to work in, and have roughly 10-20 minutes to test from start to finish.
15-30 minute start to finish
Heroku: We have set up a simple example that leverages a free server on Heroku which deploys a codebase from Github. It will capture a Zesty.io Form post and store information locally, then return to a website thank you page . To get started you need a Heroku account, it is free and only take a few minutes to create.
Airtable Heroku will be used to send data to Airtable, so you will need an account on www.airtable.com. After you setup an account, they will make you go through a tutorial, get through the tutorial.
Create a "From scratch" Airtable, it will start you with a couple of columns, delete them all but the Name column. Add one column of the type URL and name it Userfile. Your table column should like like the example below (it may not be green).
Now goto https://airtable.com/account and click Generate API Key and copy your API key. You will need to input this key when you create the Heroku build.
Now open a new tab in your browser and goto https://airtable.com/api. Click on the table you just create, and it will open API documentation. On the left navigation, click on Table 1 > create a record. On the right hand side, where the code example for curl are, click "show API key". Your screen should look like this:
When you create your Heroku server on the next step, you will be asked for these values:
If you already have a Heroku account, proceed to click the button below. If you do not have an account, create one here, then click the Depoly to Heroku button below.
The button below will automatically deploy prewritten code for you that connects Zesty.io to the Airtable API, you can find the code here https://github.com/ardeay/zesty-io-airtable-php-integration-example, you may modify that code after you get it working.
That button will open a Heroku prompt to create a new server using this PHP repository we created for this tutorial: Example Airtable Zesty Integration PHP. When you are done with this tutorial you may fork this repository and customize it to suit your needs. In the Heroku prompt, it will ask for mentioned in Step 2.
After clicking deploy, you will see two buttons
manage app and
manage app. It will open a dashboard with six menu items. The last one is
settings, click settings. Scroll down to domains, and copy the Heroku Domain provided.
Take your copied Heroku domain from Step 1 and prepend
https:// to it and append
/. The full URL should look something like this:
https://YOURCUSTOMNAME.herokuapp.com/. This is the URL you will put in the form action parameter on the
Example form HTML Form code to put on your Zesty.io template in the Code Editor:
Save in Zesty.io, goto the page in Zesty.io's live preview, and Submit a form. Depending on your file size and internet connection, the time may vary before the page return to the thank you call back. You can verify the file uploaded by visiting your Airtable or your Heroku domain
https://YOURCUSTOMNAME.herokuapp.com/list.php as that will show you files uploaded. Note, every time to redeploy the Heroku site, all files will be wiped out. From here you pass the files to your favorite storage service like AWS S3 or Dropbox.
You just successfully connected Zesty.io to your own custom PHP server hosted on Heroku. Congratulations, you all star! Being able to network applications together allows you to maximize the benefits of each application without running into the security or update risks that occur when you customize a softwares codebase!
You can Fork the https://github.com/zesty-io/example-form-file-post-with-return-php, hook it up to Heroku or your own server, are start making changes to connect to any service you wish.
© Copyright 2010-2019 Zesty.io Platform, Inc. All Rights Reserved.