Adding VPC Configuration Throws 504 Error The Request Could Not Be Satisfied

[shahbhavik01]

I'm deploying my NextJS app to AWS. This is my config:

/// <reference path="./.sst/platform/config.d.ts" />

export default $config({
  app(input) {
    return {
      name: "oneact-landing-page",
      removal: input?.stage === "production" ? "retain" : "remove",
      home: "aws",
      providers: {
        aws: {
          region: "us-east-1",
        },
      },
    };
  },
  async run() {
    new sst.aws.Nextjs("MyWeb", {
    vpc: {
          securityGroups: ["sg-123456"], 
          subnets: [
            "subnet-123456",
            "subnet-1234567",
          ],
        },
    });
  },
});

When I remove the VPC Config, the deployment works well. When I add the VPC config, the website starts throwing the following error:

For now, the security group is allowing all inbound and outbound access. The subnets are also both public subnets with Internet Gateway and NAT Gateways available. I have triple checked that VPC configuration. Any idea what can be causing this?

Also, any documentation around what ports should be allowed in the Security Group to allow for NextJS traffic would be really helpful.

[mikexavier]

I'm seeing the same when setting the vpc config in a Nextjs component.

I was losing my mind for the past week trying to figure out where I was going wrong with my vpc set-up (it could still be incorrect 🤫).

In my case, I am setting up an aws.rds.Instance postgres database, initially in a private subnet allowing incoming traffic from a public subnet, and then adding the public subnet to the Nextjs component. I wanted a set-up where the Nextjs application (a Payload CMS) could access the database, but the database wasn't publicly accessible.

I've tried a few combinations, simplified it to public subnets only for testing and opened it up allowing all traffic from everywhere. No dice.

My vpc/databse/nextjs set-up

```typescript const vpc = new aws.ec2.Vpc(`SaanaCmsVpc${stage}`, { cidrBlock: "10.0.0.0/16", enableDnsHostnames: true, enableDnsSupport: true, }); const publicSubnet1 = new aws.ec2.Subnet(`SaanaSubnetPublic1${stage}`, { vpcId: vpc.id, cidrBlock: "10.0.1.0/24", mapPublicIpOnLaunch: true, availabilityZone: "eu-central-1a", }); const publicSubnet2 = new aws.ec2.Subnet(`SaanaSubnetPublic2${stage}`, { vpcId: vpc.id, cidrBlock: "10.0.2.0/24", mapPublicIpOnLaunch: true, availabilityZone: "eu-central-1b", }); const dbSecurityGroup = new aws.ec2.SecurityGroup( `SaanaDbSecurityGroup${stage}`, { vpcId: vpc.id, ingress: [ { protocol: "tcp", fromPort: 5432, toPort: 5432, cidrBlocks: ["0.0.0.0/0"], }, ], egress: [ { protocol: "-1", fromPort: 0, toPort: 0, cidrBlocks: ["0.0.0.0/0"], }, ], } ); const dbSubnetGroup = new aws.rds.SubnetGroup(`SaanaCmsDbSubnetGroup${stage}`, { name: `saana-db-subnet-group-${stage}`, subnetIds: [publicSubnet1.id, publicSubnet2.id], }); const internetGateway = new aws.ec2.InternetGateway( `SaanaCmsInternetGateway${stage}`, { vpcId: vpc.id, } ); const publicRouteTable = new aws.ec2.RouteTable( `SaanaCmsPublicRouteTable${stage}`, { vpcId: vpc.id, routes: [ { cidrBlock: "0.0.0.0/0", gatewayId: internetGateway.id, }, ], } ); const publicRouteTableAssociation1 = new aws.ec2.RouteTableAssociation( `SaanaCmsPublicRouteTableAssociation1${stage}`, { subnetId: publicSubnet1.id, routeTableId: publicRouteTable.id, } ); const publicRouteTableAssociation2 = new aws.ec2.RouteTableAssociation( `SaanaCmsPublicRouteTableAssociation2${stage}`, { subnetId: publicSubnet2.id, routeTableId: publicRouteTable.id, } ); export const db = new aws.rds.Instance(`SaanaCmsPostgresDb${stage}`, { identifier: `saana-cms-postgres-db-${stage}`, engine: "postgres", engineVersion: "16.2", instanceClass: "db.t3.micro", allocatedStorage: 20, dbName: `cmsPostgresDb${stage}`, username: `saanaCmsDb${stage}`, password: rdsPassword.value, storageType: "gp2", vpcSecurityGroupIds: [dbSecurityGroup.id], dbSubnetGroupName: dbSubnetGroup.name, skipFinalSnapshot: true, publiclyAccessible: isDev, deletionProtection: isProduction, }); let cms; CmsDbConnectionString.apply((connectionString) => { cms = new sst.aws.Nextjs("SaanaCMS", { path: "packages/cms", vpc: { securityGroups: [cmsSecurityGroupId], subnets: [publicSubnetId1, publicSubnetId2], }, domain: { name: domain, dns: sst.aws.dns({ zone: zoneId, }), }, environment: { NEXT_PUBLIC_CMS_MEDIA_S3_REGION: CmsMediaS3Region, NEXT_PUBLIC_CMS_MEDIA_S3_ENDPOINT: CmsMediaS3EndPoint, RDS_POSTGRES_DB_CONNECTION_STRING: connectionString, }, link: [ CmsBucket, CmsMediaS3AccessKeyId, CmsMediaS3SecretAccessKey, PayloadSecret, SupabaseConnectionString, ], }); }); export { cms }; ``` --- I was kinda hoping by copy/pasting all that, I'd notice something... but I'm blind at this point. I've logged all variables and secret, all seem correct and passed in as expected

[victor-landa]

Facing the same issue 😞

[mikexavier]

Hey @shahbhavik01 @victor-landa did you manage to get this working somehow?

@fwang this is a bit of a blocker for me. It would be great to know if it's a skill issue or something on the SST side.

Cheers!

[jayair]

I'll check