[AWS] SAM S3 presigned url - 2

코드 구조

참고 - README.md

frontend - 폴더
index.html이 있으며 여기서 코드 수정 가능! 하지만
저 html을 수정해본 결과

const API_ENDPOINT = '<< ENTER HERE >>'

이 부분만 가져오면 frontend폴더는 자신이 원하는 페이지로 대체 가능

getSignedURl 폴더의 app.js

aws s3로 upload할 때의 파라미터값 기본 구성

template.yaml

lambda함수 및 API Gateway 생성

  MyApi: "http api gateway 이름"
    Type: AWS::Serverless::HttpApi
    Properties:
      # CORS configuration - this is open for development only and should be restricted in prod.
      # See https://docs.aws.amazon.com/serverless-application-model/latest/developerguide/sam-property-httpapi-httpapicorsconfiguration.html   
      CorsConfiguration:
        AllowMethods:
          - GET
          - POST
          - DELETE
          - OPTIONS
        AllowHeaders:
          - "*"   
        AllowOrigins: 
          - "*"      

lambda함수 생성

  UploadRequestFunction:
    # More info about Function Resource: https://github.com/awslabs/serverless-application-model/blob/master/versions/2016-10-31.md#awsserverlessfunction
    Type: AWS::Serverless::Function 
    Properties:
      CodeUri: getSignedURL/
      Handler: app.handler
      Runtime: nodejs16.x
      Timeout: 3
      MemorySize: 128
      Environment:
        Variables:
          UploadBucket: !Ref {name}  
      Policies:
        - S3WritePolicy:
            BucketName: !Ref {name}
        ## This permission allows the Lambda function to request signed URLs
        ## for objects that will be publicly readable. Uncomment if you want this ACL.
        # - Statement:
        #   - Effect: Allow
        #     Resource: !Sub 'arn:aws:s3:::${S3UploadBucket}/'
        #     Action:
        #       - s3:putObjectAcl
      Events:
        UploadAssetAPI:
          Type: HttpApi
          Properties:
            Path: /uploads
            Method: get
            ApiId: !Ref MyApi

개인적으로 중요하게 생각하는 부분은

CodeURi : app.js가 있는 폴더 경로
Runtime: nodejs 버전 - 버전에 따라 오류가 다름
Path: http Api의 경로 data정보가 표시될 URL(apiendpoint)

추가로 http api를 추가하려면

  MyApi:
    Type: AWS::Serverless::HttpApi
    Properties:
      # CORS configuration - this is open for development only and should be restricted in prod.
      # See https://docs.aws.amazon.com/serverless-application-model/latest/developerguide/sam-property-httpapi-httpapicorsconfiguration.html   
      CorsConfiguration:
        AllowMethods:
          - GET
          - POST
          - DELETE
          - OPTIONS
        AllowHeaders:
          - "*"   
        AllowOrigins: 
          - "*"      
  MyApi2:
    Type: AWS::Serverless::HttpApi
    Properties:
      # CORS configuration - this is open for development only and should be restricted in prod.
      # See https://docs.aws.amazon.com/serverless-application-model/latest/developerguide/sam-property-httpapi-httpapicorsconfiguration.html   
      CorsConfiguration:
        AllowMethods:
          - GET
          - POST
          - DELETE
          - OPTIONS
        AllowHeaders:
          - "*"   
        AllowOrigins: 
          - "*"      
          
      Events:
        UploadAssetAPI:
          Type: HttpApi
          Properties:
            Path: /uploads
            Method: get
            ApiId: !Ref MyApi
        UploadAssetAPI2:
          Type: HttpApi
          Properties:
            Path: /uploads_2
            Method: get
            ApiId: !Ref MyApi2

Outputs:
  APIendpoint:
    Description: "HTTP API endpoint URL"
    Value: !Sub "https://${MyApi}.execute-api.${AWS::Region}.amazonaws.com"
    
APIendpoint2:
    Description: "HTTP API endpoint URL"
    Value: !Sub "https://${MyApi2}.execute-api.${AWS::Region}.amazonaws.com"

이 3가지를 이름만 다르게 하니 http api가 2개가 생성 되었고 다 작동 했다!