Front-End Web & Mobile
IAM Compute Roles for Server-Side Rendering with AWS Amplify Hosting
Today, AWS Amplify Hosting is introducing compute roles for AWS Amplify applications, enabling you to extend server-side rendering capabilities with secure access to AWS services from the compute runtime. With compute roles, developers can attach specific permissions to their server-side rendered apps, allowing Amplify to make authorized calls to other AWS services. This new capability helps streamline the development process while maintaining security best practices for your applications.
Key capabilities
With compute roles, you can now:
- Access sensitive configuration data at runtime within Next.js API routes using AWS Secrets Manager and AWS Systems Manager Parameter Store
- Connect your SSR apps directly to databases like Amazon RDS, Amazon DynamoDB. and other AWS databases
- Define fine-grained permissions for your compute environment using AWS Identity and Access Management (IAM) policies
- Make secure, authenticated calls to any AWS service from your server-side code
Tutorial
To get started, follow these steps to create an IAM compute role and associate it with an Amplify Next.js application:
Prerequisites
Before you begin, make sure you have the following installed:
Create an IAM compute role
Let’s create an IAM role that allows Amplify Hosting’s SSR compute service to securely access AWS resources based on the role’s permission and trust relationship. In our example, we’ll securely access an Amazon Simple Storage Service (Amazon S3) bucket.
- Sign in to the AWS Management console and navigate to the IAM console
- Under the Access Management tab, choose Roles, then select Create role
- Select Custom trust policy and enter the following policy to allow Amplify to assume the role:
- Add the AWS managed
AmazonS3ReadOnlyAccess
permission policy to the role and choose Next - Name the role
amplify-compute-role
and choose Create role
You have successfully created a compute role that Amplify can assume to connect to other AWS services.
Security Best Practice: Implement the principle of least privilege by granting only essential permissions for your specific use case.
Create an Amazon S3 bucket
We will now setup a private Amazon S3 bucket that the Next.js app can securely access using the compute role. Instead of exposing Amazon S3 objects publicly or managing access keys, we’ll use Amplify Hosting’s compute role to securely retrieve private content from Amazon S3.
- Sign in to the AWS Management console and navigate to the Amazon S3 console
- Choose Create bucket and enter a unique bucket name
- Keep ACLs disabled and Block all public access enabled
- Keep the default settings and choose Create bucket
- Navigate to the bucket and choose Upload
- Upload an image (e.g. amplify-logo.png)
Security Verification: To confirm that your S3 bucket is completely locked down, run the following get-public-access-block AWS CLI command:
The expected output should show:
These settings ensure:
- No public ACLs can be created
- Existing public ACLs are ignored
- Public bucket policies are blocked
- Public access to the bucket is restricted
Create a Next.js app
Next, we will create a Next.js app to securely access private content (an image) from an Amazon S3 bucket using an API route.
- Create a new Next.js 15 app with Typescript and Tailwind CSS
- Install the AWS SDK for JavaScript S3 Client package:
- Create an Amazon S3 Image API route:
- Create a client component:
- Update the home page to render the client component:
- Push the changes to a git repository:
- Create a new GitHub repository
- Add and commit the changes to the git branch
- Add remote origin and push the changes upstream
Deploy the application to Amplify Hosting
- Sign in to the AWS Management Console and navigate to the Amplify console
- Choose Create new app and select GitHub as the repository source
- Authorize Amplify to access your GitHub account
- Choose the repository and branch you created
- Review the App settings and then choose Next
- Review the overall settings and choose Save and deploy
Attaching the IAM compute role to an Amplify app
- In the Amplify console, select your app and navigate to App settings > IAM roles
- Choose Edit in the compute role section
- From the role menu, select the
amplify-compute-role
and choose Save - You can also add branch overrides to use a unique compute role per branch. This can particularly be helpful across different git environments such as dev, staging, or production.
Access the deployed Next.js app
Navigate to the app’s Overview tab in the Amplify console and open the default Amplify generated URL in the browser.
Next, choose the Access Private S3 button. You should now observe the image that was uploaded to the Amazon S3 bucket.
Review the hosting compute logs
From the App home page, navigate to Hosting > Monitoring and then choose the Hosting compute logs tab.
Navigate to the Amazon CloudWatch log streams URL and review the latest log stream. The logs should contain the Amazon S3 image requests:
Congratulations! You’ve successfully created and attached an IAM compute role to your Next.js SSR application on Amplify Hosting, enabling secure content retrieval from your private Amazon S3 bucket! 🚀
Cleanup
- Delete the AWS Amplify app by navigating to App settings > General settings, then choose Delete app.
- Delete the Amazon S3 bucket by navigating to S3 console > Select bucket > Select Delete > Enter the bucket name to confirm deletion
- Delete the IAM role by navigating to IAM console > Select Roles > Find the amplify-compute-role name > Select Delete > Enter the role name to confirm deletion
Summary
AWS Amplify Hosting now offers compute roles for server-side rendered (SSR) applications, solving the challenge of securely accessing AWS services. Previously, developers manually managed credentials through environment variables. Now, with compute roles, developers can directly attach IAM permissions to their SSR apps, simplifying service integration and enhancing security.
Add compute roles to your SSR apps today by checking out the Amplify documentation.