Use lamdba@edge to redirect SPA instead of 403 from S3 (#77)

* Use lamdba@edge to redirect SPA

* add back the 403 test

Author: devksingh4

cloudformation/iam.yml

@@ -242,6 +242,34 @@ Resources:
                     ses:Recipients:
                       - "*@illinois.edu"
 
+
+  EdgeLambdaIAMRole:
+    Type: AWS::IAM::Role
+    Properties:
+      AssumeRolePolicyDocument:
+        Version: "2012-10-17"
+        Statement:
+          - Effect: Allow
+            Principal:
+              Service: "lambda.amazonaws.com"
+            Action: "sts:AssumeRole"
+          - Effect: Allow
+            Principal:
+              Service: "edgelambda.amazonaws.com"
+            Action: "sts:AssumeRole"
+      Policies:
+        - PolicyName: lambda-edge
+          PolicyDocument:
+            Version: "2012-10-17"
+            Statement:
+              - Effect: Allow
+                Action:
+                  - "logs:CreateLogGroup"
+                  - "logs:CreateLogStream"
+                  - "logs:PutLogEvents"
+                Resource:
+                  - Fn::Sub: arn:aws:logs:${AWS::Region}:${AWS::AccountId}:log-group:/aws/lambda/${LambdaFunctionName}-edge:*
+
 Outputs:
   MainFunctionRoleArn:
     Description: Main API IAM role ARN
@@ -254,3 +282,8 @@ Outputs:
   EntraFunctionRoleArn:
     Description: Entra IAM role ARN
     Value: !GetAtt EntraLambdaIAMRole.Arn
+
+  EdgeFunctionRoleArn:
+    Description: Edge IAM role ARN
+    Value: !GetAtt EdgeLambdaIAMRole.Arn
+

cloudformation/logs.yml

@@ -14,4 +14,10 @@ Resources:
       LogGroupName:
         Fn::Sub: /aws/lambda/${LambdaFunctionName}
       RetentionInDays:
-        Ref: LogRetentionDays
+        Ref: LogRetentionDays
+  EdgeLambdaLogGroup:
+    Type: AWS::Logs::LogGroup
+    Properties:
+      LogGroupName:
+        Fn::Sub: /aws/lambda/${LambdaFunctionName}-edge
+      RetentionInDays: 7

cloudformation/main.yml

@@ -576,6 +576,8 @@ Resources:
     Type: AWS::S3::Bucket
     Properties:
       BucketName: !Sub ${S3BucketPrefix}-ui
+      WebsiteConfiguration:
+        IndexDocument: index.html
 
   CloudFrontOriginAccessIdentity:
     Type: AWS::CloudFront::CloudFrontOriginAccessIdentity
@@ -635,6 +637,9 @@ Resources:
             Cookies:
               Forward: none
           CachePolicyId: 658327ea-f89d-4fab-a63d-7e88639e58f6 # caching-optimized
+          LambdaFunctionAssociations:
+            - EventType: origin-request
+              LambdaFunctionARN: !Ref AppFrontendEdgeLambdaVersion
         CacheBehaviors:
           - PathPattern: "/api/v1/events*"
             TargetOriginId: ApiGatewayOrigin
@@ -675,11 +680,6 @@ Resources:
             - EnvCertificateArn
           MinimumProtocolVersion: TLSv1.2_2021
           SslSupportMethod: sni-only
-        CustomErrorResponses:
-          - ErrorCode: 403
-            ResponseCode: 200
-            ResponsePagePath: /index.html
-            ErrorCachingMinTTL: 0
         HttpVersion: http2
         PriceClass: PriceClass_100
 
@@ -721,6 +721,34 @@ Resources:
           CookiesConfig:
             CookieBehavior: none
 
+  AppFrontendEdgeLambda:
+    Type: AWS::Lambda::Function
+    DependsOn:
+      - AppLogGroups
+    Properties:
+      FunctionName: !Sub ${ApplicationPrefix}-lambda-edge
+      Handler: "index.handler"
+      Role: !GetAtt AppSecurityRoles.Outputs.EdgeFunctionRoleArn
+      Runtime: nodejs22.x
+      Code:
+        ZipFile: |
+          'use strict';
+          exports.handler = async (event) => {
+              const request = event.Records[0].cf.request;
+              const uri = request.uri;
+              if (!uri.startsWith('/api') && !uri.match(/\.\w+$/)) {
+                  request.uri = "/index.html";
+              }
+              return request;
+          };
+      MemorySize: 128
+      Timeout: 5
+
+  AppFrontendEdgeLambdaVersion:
+    Type: AWS::Lambda::Version
+    Properties:
+      FunctionName: !Ref AppFrontendEdgeLambda
+
 Outputs:
   DomainName:
     Description: Domain name that the UI is hosted at

tests/live/mobileWallet.test.ts

@@ -3,17 +3,17 @@ import { expect, test, describe } from "vitest";
 const baseEndpoint = `https://core.aws.qa.acmuiuc.org`;
 
 describe("Mobile pass issuance", async () => {
-  // test(
-  //   "Test that passes will not be issued for non-members",
-  //   { timeout: 10000 },
-  //   async () => {
-  //     const response = await fetch(
-  //       `${baseEndpoint}/api/v1/mobileWallet/[email protected]`,
-  //       { method: "POST" },
-  //     );
-  //     expect(response.status).toBe(403);
-  //   },
-  // );
+  test(
+    "Test that passes will not be issued for non-members",
+    { timeout: 10000 },
+    async () => {
+      const response = await fetch(
+        `${baseEndpoint}/api/v1/mobileWallet/[email protected]`,
+        { method: "POST" },
+      );
+      expect(response.status).toBe(403);
+    },
+  );
   test(
     "Test that passes will be issued for members",
     { timeout: 10000 },

tests/live/stripe.test.ts

@@ -5,28 +5,28 @@ const baseEndpoint = `https://core.aws.qa.acmuiuc.org`;
 
 describe("Stripe live API authentication", async () => {
   const token = await createJwt();
-  // test(
-  //   "Test that auth is present on the GET route",
-  //   { timeout: 10000 },
-  //   async () => {
-  //     const response = await fetch(
-  //       `${baseEndpoint}/api/v1/stripe/paymentLinks`,
-  //       { method: "GET" },
-  //     );
-  //     expect(response.status).toBe(403);
-  //   },
-  // );
-  // test(
-  //   "Test that auth is present on the POST route",
-  //   { timeout: 10000 },
-  //   async () => {
-  //     const response = await fetch(
-  //       `${baseEndpoint}/api/v1/stripe/paymentLinks`,
-  //       { method: "POST" },
-  //     );
-  //     expect(response.status).toBe(403);
-  //   },
-  // );
+  test(
+    "Test that auth is present on the GET route",
+    { timeout: 10000 },
+    async () => {
+      const response = await fetch(
+        `${baseEndpoint}/api/v1/stripe/paymentLinks`,
+        { method: "GET" },
+      );
+      expect(response.status).toBe(403);
+    },
+  );
+  test(
+    "Test that auth is present on the POST route",
+    { timeout: 10000 },
+    async () => {
+      const response = await fetch(
+        `${baseEndpoint}/api/v1/stripe/paymentLinks`,
+        { method: "POST" },
+      );
+      expect(response.status).toBe(403);
+    },
+  );
   test(
     "Test that getting existing links succeeds",
     { timeout: 10000 },