DEV Community

Jason Butz
Jason Butz

Posted on • Originally published at jasonbutz.info on

Using Lambda Function URLs to Collect Form Submissions

This past week AWS announced Lambda Function URLs, public endpoints you can enable for Lambda functions to allow them to be invoked. These endpoints can be authorized with IAM, or have no authorization. These new endpoints are well suited to one-off endpoints that don't require all the capabilities of API Gateway. These URLs are very well suited for use with webhooks. You can also use them to enable functionality on websites and blogs, for example accepting form submissions. Function URLs come with built-in CORS support, so using Function URLs for calls from websites was something AWS had in mind.

I've gone ahead and created a basic proof of concept showing how you can use the AWS CDK to deploy a Lambda function with a Function URL enabled to accept form submissions from a website. It should be noted that this is a very simple proof of concept, and it is not meant to be a production-ready solution. It saves your form submissions as a log message in CloudWatch instead of sending any kind of email or saving it to a database. It also has no mechanism in place to filter out spam submissions. I do have throttling in place to help limit the impact of nefarious entities invoking the function frequently to maliciously increase costs.

The repo has setup instructions to walk you through setup and deployment, take a look, and if you run into issues feel free to leave an issue.

GitHub logo jbutz / aws-lambda-url-poc

Proof of Concept showing how you can use AWS Lambda URLs to accept form input from a website

AWS Lambda URL Proof of Concept

Proof of Concept showing how you can use AWS Lambda URLs to accept form input from a website

Setup

  1. Ensure you have Node.js 14 or Node.js 16 installed on your machine
  2. Ensure you have the AWS CLI installed on your machine
  3. Configure a terminal session with AWS programmatic credentials
  4. Install this repo's dependencies
    npm ci
    Enter fullscreen mode Exit fullscreen mode
  5. Run the CDK's boostrap command to ensure you AWS account is configured correctly
    npx cdk boostrap
    Enter fullscreen mode Exit fullscreen mode
  6. Deploy the AWS resources
    npm run deploy
    Enter fullscreen mode Exit fullscreen mode
  7. At the end of the deploy there will be outputs, one will be called PocStack.FormHandlerUrlOutput. Take the URL next to it and use that as the value of the action attribute in public/index.html.
  8. Start the demo HTTP server then open the demo website in your browser.
    npm run serve
    Enter fullscreen mode Exit fullscreen mode



Top comments (0)