When me and my team first started working on an AWS Amplify app, we came up to a problem; we wanted to share the same Amplify app between multiple AWS accounts. Each person on our team had their own AWS account in an AWS Organization and each account was completely separate with no access to resources in other accounts.

We wanted to share the Amplify app among us without having to create a separate Amplify environment for each developer.

Solution

The solution that was suggested to us on the AWS Amplify GitHub site was to allow access to the Amplify app to another AWS account using IAM Roles. I am going to go down the whole procedure on how to achieve that.

Let’s say we have 2 AWS accounts. Let’s call the account that hosts the Amplify app origin and the other account that will access origin to perform ops, we call that account crosspublisher. We are going to use these terminologies in the rest of the text.

STAGE 1: Origin Account setup: Setting up a cross-account role

In the account that is going to host the Amplify app:

  • Open the IAM Console.
  • Click Roles in the lest sidebar.
  • Click Create Role.
  • In the Select type of trusted entity, select Another AWS Account.
  • In the Account ID field, provide the account ID of the crosspublisher account.
    • To get the account ID, on the right of the top menu bar, there is a drop down that displays your account username/ID(just before Global and Support dropdowns). Click it and then choose My Account from it. The page that will open is going to show you the Account ID.
  • Enabling External ID and MFA is optional. We will leave for this tutorial.
  • Click Next: Permissions.
  • You can choose AdministratorAccess as the policy in the next section as a lot of permissions are required for Amplify. But if you want a bare minimum list, then you can create a policy with the permissions mentioned here.
  • Click Next: Tags -> Next: Review.
  • Provide a Role Name. We will name it origin-amplify.
  • Click Create Role.

After the IAM role is created, open it and copy the Role ARN. We are going to need it in the next step.

Stage 2: CrossPublisher account setup: setting up a new user

Create new policy

In the crosspublisher AWS account:

  • Open the IAM Console.
  • In the left sidebar, click Policies and then Create Policy.
  • Click JSON and paste the following text in the text area:
{
 "Version": "2012-10-17",
 "Statement": [
     {
         "Effect": "Allow",
         "Action": "sts:AssumeRole",
         "Resource": "<origin-role-arn>"
     }
 ]
}
  • Replace <origin-role-arn> with the Role ARN of the role we created in the last section in the origin account.
  • Click Review policy.
  • Provide a name. We will call it crosspublisher-policy.
  • Click Create Policy.

Create new user and Attach the policy

In the AWS IAM Console:

  • Click Users from the left sidebar and click Add User.
  • Enter a username. We will name it crosspublisher-user here.
  • In the Access Type, click Programmatic Access.
  • Click Next: Permissions.
  • In the permissions section, click Attach existing policies directly and from the list of policies, choose crosspublisher-policy that we created in the last section.
  • Click Next: Tags -> Next: Review -> Create User.

Download the csv file that contains your credentials or copy and store them manually. We are going to need these credentials next.

Stage 3: Configuring AWS credentials on your machine.

If you don’t have the following 2 files:

  • ~/.aws/config
  • ~/.aws/credentials

Then create them. The ~/.aws folder is the location where your AWS credentials are stored.

Open ~/.aws/config and paste the following:

[profile origin]
role_arn=<role_arn_of_origin>
source_profile=crosspublisher
region=us-west-2

[profile crosspublisher]
region=us-west-2

Again place the ARN of the role we created in the origin account earlier and also change the region to any region you please.

Open ~/.aws/credentials and paste the following:

[crosspublisher]
aws_access_key_id=<access_key_of_crosspublisher_account>
aws_secret_access_key=<secret_key_crosspublisher_account>

Replace the above access and secret keys with the ones you retrieved after creating the new user.

You are all set.

You can now configure and push Amplify resources to the origin account using the origin profile.

The emphasis here is on using the ORIGIN profile to push the resources to the origin account. We are NOT going to be using the crosspublisher profile here.

How it all works

First in the origin account, we create a role that specifies the crosspublisher account’s Account ID which grants permission to crosspublisher to access resources in the origin account. The access permissions allowed are defined in this role.

Next, we create a policy that mentions the origin account’s role which will allow permissions to crosspublisher, and attach that policy to a new user. This crosspublisher account’s user can now access resources in origin account.

In the last step, we create profiles in ~/.aws/config for both profiles. The difference is that in the origin profile, we reference the origin account’s role and also the crosspublisher profile located in the same config file. In the ~/.aws/credentials file, we provide the access and secret keys.

When we run amplify init, we specify the origin profile. But first, it is going to use the credentials of the crosspublisher profile as it is referenced and if all is well, it is then going to see if the specified origin role in origin account allows access to the crosspublisher account or not.

Amplify configuration in action

Assuming that you already have a Javascript application(Angular/React) setup and Amplify CLI installed, run the following commands:

amplify init
Note: It is recommended to run this command from the root of your app directory
? Enter a name for the project angular-new
? Enter a name for the environment dev
? Choose your default editor: Visual Studio Code
? Choose the type of app that you're building javascript
Please tell us about your project
? What javascript framework are you using angular
? Source Directory Path:  src
? Distribution Directory Path: dist
? Build Command:  npm run-script build
? Start Command: ng serve
Using default provider  awscloudformation

For more information on AWS Profiles, see:
https://docs.aws.amazon.com/cli/latest/userguide/cli-multiple-profiles.html

? Do you want to use an AWS profile? Yes
? Please choose the profile you want to use origin
Adding backend environment dev to AWS Amplify Console app: .........

Then add a service and push your changes:

amplify add auth
amplify push

And you will be able to see your pushed changes in the origin account; an account to which otherwise, you wouldn’t have access to.

Summary

This post shows how multiple developers can push their changes to a single AWS account where the Amplify app’s resources are hosted. This helps in scenarios where all the developers have their own AWS accounts and need to have a single location for the Amplify app and work on it in collaboration instead of deploying their resources separately in their own accounts which later leads to unexpected results when deploying to production.