AWS Amplify 및 AppSync를 사용하는 직접 Lambda 해석기

특정 날짜에 VTL에 대해 어떻게 느끼는지

Haha okay, okay. I'm just kiddin' (mostly).

AWS는 최근에 지원Direct Lambda Resolvers을 발표했습니다. 즉, Velocity 템플릿 언어에 의존하지 않고 선호하는 Lambda 런타임에서 AppSync 확인자를 작성할 수 있습니다.

VTL로 작성하는 방법을 모르는 복잡한 논리가 있었고 javascript로 작성하는 것이 훨씬 쉬웠기 때문에 이것을 활용하고 싶었습니다. @function 지시문에서 약간의 마법을 사용하여 Amplify 프로젝트에 Direct Lambda Resolvers를 추가한 방법을 공유하겠습니다.

다음을 위한 GraphQL API를 이미 만들었다고 가정하겠습니다.
Amplify 프로젝트. 아직 수행하지 않은 경우 방법Create a GraphQL API에 대한 단계를 따르십시오.

1단계: Amplify CLI로 Lambda 생성

amplify add function
? Provide a friendly name for your resource to be used as a label for this category in the project: DirectLambdaResolver
? Provide the AWS Lambda function name: DirectLambdaResolver
? Choose the function runtime that you want to use: NodeJS
? Choose the function template that you want to use: Hello World
? Do you want to access other resources created in this project from your Lambda function? No
? Do you want to invoke this function on a recurring schedule? No
? Do you want to edit the local lambda function now? Yes

amplify/backend/function/DirectLambdaResolver/src/index.js로 이동하여 다음과 같이 업데이트합니다.

let response;

exports.handler = async (event, context) => {
    console.log({event, context})
    try {
        response = "this lambda is super direct"
    } catch (err) {
        console.log({err})
        console.log(err);
        return err;
    }

    return response
};

좋아, 파일을 저장하고 계속하려면 터미널에서 Enter 키를 누르십시오.

2단계: @function으로 코드 자동 생성 및 CustomResources.json에 코드 복사

이제 amplify/backend/api/[your-api-name]/schema.graphql로 이동하여 @function 지시문을 활용합니다.

### schema.graphql
type Todo @model {
  id: ID
  task: String @function(name: "DirectLambdaResolver-${env}")
}

그 다음에

$: amplify api gql-compile

그러면 내부에 모든 파일이 생성됩니다amplify/backend/api/[your-api-name]/build/. 우리가 찾고 있는 것은 FunctionDirectiveStack.json 파일입니다. 열면 다음과 같이 표시됩니다.

{
    "AWSTemplateFormatVersion": "2010-09-09",
    "Description": "An auto-generated nested stack.",
    "Metadata": {},
    "Parameters": {
      ...
    },
    "Resources": {
      // IAM Role
      "DirectLambdaResolverLambdaDataSourceRole": {
         ...
      },
      // DataSource
      "DirectLambdaResolverLambdaDataSource": {
         ...
      },
      // Direct Lambda Resolver
      "InvokeDirectLambdaResolverLambdaDataSource": {
         ...
      },
      // Pipeline Resolver
      "TodotaskResolver": {
         ...
      }
    }

When amplify auto-generates with @function, it creates a Lambda DataSource, an IAM Role for that DataSource, the Direct Lambda Resolver and a Pipeline Resolver.

Resources 개체에서 모든 항목을 복사하여 CustomResources.json 에 있는 amplify/backend/api/[your-api-name]/stacks/ 파일에 붙여넣습니다. 이제 다음과 같이 표시됩니다.

{
  "AWSTemplateFormatVersion": "2010-09-09",
  "Description": "An auto-generated nested stack.",
  "Metadata": {},
  "Parameters": {
     ...
  },
  "Resources": 
    "DirectLambdaResolverLambdaDataSourceRole": {
      ...
    },
    "DirectLambdaResolverLambdaDataSource": {
      ...
    },
    "InvokeDirectLambdaResolverLambdaDataSource": {
      ...
    },
    "TodotaskResolver": {
      ...
    }
  },
  "Conditions": {
    ...
  },
  "Outputs": {
    ...
  }
}

또한 DirectLambdaResolverLambdaDataSourceRole를 GetAttGraphQLAPIApiId로 교체하기 위해 AppSyncApiId를 업데이트해야 합니다.

"DirectLambdaResolverLambdaDataSourceRole": {
      "Type": "AWS::IAM::Role",
      "Properties": {
        "RoleName": {
          "Fn::If": [
            "HasEnvironmentParameter",
            {
              "Fn::Join": [
                "-",
                [
                  "DirectLambdaResolver774c",
                  {
                    "Ref": "AppSyncApiId" // Used to be GetAttGraphQLAPIApiId
                  },
                  {
                    "Ref": "env"
                  }
                ]
              ]
            },
            {
              "Fn::Join": [
                "-",
                [
                  "DirectLambdaResolver774c",
                  {
                     "Ref": "AppSyncApiId" // Used to be GetAttGraphQLAPIApiId
                  }
                ]
              ]
            }
          ]
        },
        "AssumeRolePolicyDocument": {
         ...
        },
        "Policies": [
          ...
        ]
      }
    },

다음으로 AppSync를 사용하여 새 Lambda를 Direct Lambda Resolver로 만들려면 함수에서 요청 및 응답 매핑 템플릿을 제거해야 합니다InvokeDirectLambdaResolverLambdaDataSource. Properties 개체 안에 중첩되어 있습니다.

"InvokeDirectLambdaResolverLambdaDataSource": {
  "Type": "AWS::AppSync::FunctionConfiguration",
  "Properties": {
    "ApiId": {
        "Ref": "AppSyncApiId"
    },
    "Name": "InvokeDirectLambdaResolverLambdaDataSource",
    "DataSourceName": "DirectLambdaResolverLambdaDataSource",
    "FunctionVersion": "2018-05-29",
    // REMOVE ME 
    "RequestMappingTemplateS3Location": {
      ...
    },
    // REMOVE ME 
    "ResponseMappingTemplateS3Location": {
      ...
    }
  },

  "DependsOn": "DirectLambdaResolverLambdaDataSource"
}

또한 Todo.task.req.vtl 및 Todo.task.res.vtl를 amplify/backend/api/[your-api-name]/build/resolvers에서 amplify/backend/api/[your-api-name]/resolvers로 복사해야 합니다.

Wait a minute. I thought we said no more VTL? What gives?
TodotaskResolver is a Pipeline Resolver. InvokeDirectLambdaResolverLambdaDataSource is our Direct Lambda Resolver.

Don't wan't a Pipeline resolver? Don't worry, I got you covered towards the end 😉

3단계: 자동 생성된 코드 제거

schema.graphql 내의 @function(name: "DirectLambdaResolver-${env} 필드에 task: String 지시문을 어떻게 추가했는지 기억하십니까? FunctionDirectiveStack.json를 포함하여 생성된 모든 코드를 제거해야 합니다.

다행히 꽤 쉽습니다. @function를 제거하고 다음을 실행하십시오.

$: amplify api gql-compile

amplify/backend/api/[your-api-name]/build/ 내부를 보면 업데이트된 CustomResources.json 파일과 FunctionDirectiveStack.json이 제거된 것을 볼 수 있습니다.

푸-푸시 진짜 좋아

$: amplify push

AppSync 콘솔로 이동하는 경우 스키마를 클릭하고 Resolvers 검색 필드 내에서 Todo를 검색하고 task까지 아래로 스크롤하면 Pipeline로 표시되어야 합니다. 그것을 클릭하면 DirectLambdaResolver가 나열된 Todo.task Pipeline Resolver로 이동합니다. 매핑 템플릿이 비활성화된 것을 알 수 있습니까?



Yeaaa 친구, 더 이상 VTL (일종) 😆 😆 😆

보너스 라운드: 파이프라인 해석기 제거

앞서 약속한 대로 Todo.task Pipeline Resolver를 제거하려면 amplify/backend/api/[your-api-name]/stacks/CustomResources.json 내부에서 두 가지를 변경해야 합니다.

먼저 TodotaskResolver 를 삭제합니다.
둘째, InvokeDirectLambdaResolverLambdaDataSource를 다음으로 바꿉니다.

"TodotaskDirectLambdaResolver": {
  "Type": "AWS::AppSync::Resolver",
  "Properties": {
    "ApiId": {
        "Ref": "AppSyncApiId"
    },
    "DataSourceName": "DirectLambdaResolverLambdaDataSource",
    "TypeName": "Todo",
    "FieldName": "task"
  },

  "DependsOn": "DirectLambdaResolverLambdaDataSource"
}

$: amplify api push

이제 마음대로 VTL 템플릿을 제거하십시오!

이 게시물이 마음에 드셨기를 바라며 즐거우셨다면 Twitter에서 저를 팔로우하여 AWS Amplify, AppSync 및 React-Native에 대해 모두 알아보세요 🙌 🙌 🙌

자원:
Add a custom resolver that targets an aws lambda
How to add pipelineResolvers - Github Issue