[CDK] AppSyncのOIDCプロバイダーにLINEを設定したい

dyoshikawa

2022.04.29

この記事は公開されてから1年以上経過しています。情報が古い可能性がありますので、ご注意ください。

広島の吉川です。

早速ですが、AWS AppSync APIにLIFFアプリ/LINEミニアプリの認証を設定する方法を紹介します。

環境

node 16.13.0
typescript 3.9.7
aws-cdk 2.20.0
aws-cdk-lib 2.20.0
@aws-cdk/aws-appsync-alpha 2.20.0
constructs 10.0.115

LINE ChannelとLIFF Applicationを作成

LINE Developersより、LINEプロバイダ選択→「Create a new Channel」押下→「LINE Login」押下でChannel新規作成画面を開き、

Channel type: 「LINE Login」
Provider: 任意
Region: 「Japan」
Company or owner's country or region: 「Japan」
Channel icon: 任意
Channel description: 任意
App types: 「Web app」+「Mobile app」
Email address: 任意
Privacy policy URL: 空欄
Terms of use URL: 空欄

としてChannelを作成します。

続いてChannelの中にLIFFを作成します。「LIFF」タブを選択→「Add」を押下し、

LIFF app name: 任意
Size: Full
Endpoint URL: https://localhost:5000
Scopes: 「openid」
Bot link feature

としてLIFF Applicationを作成します。Scopesが重要となっており、今回はOIDCを使うのでopenidにチェックを入れておいてください。

上記作成後、

LINE Login Channel ID
LIFF ID

をそれぞれ控えておきます。

GraphQL Schemaファイル

type User {
  lineUserId: String!
}
type Query {
  findUser: User!
}

DataSourceとするLambda関数コード

「IDトークンから得られたLINEユーザIDを返す」というシンプルなLambda関数を用意します。

// lambda-handler/find-user-handler.ts
import { AppSyncIdentityOIDC, AppSyncResolverEvent } from 'aws-lambda'

export const handler = async (event: AppSyncResolverEvent<{}, {}>) => {
  console.log(JSON.stringify({ event }))

  const lineUserId = (event.identity as AppSyncIdentityOIDC).sub

  return {
    lineUserId,
  }
}

ちなみに、 event 引数をdumpした中身は下のようになります。機密情報は大文字スネークケースの文字列などでマスクしています。

{
  "event": {
    "arguments": {},
    "identity": {
      "claims": {
        "sub": "LINE_USER_ID",
        "aud": "LINE_LOGIN_CHANNEL_ID",
        "amr": ["linesso"],
        "iss": "https://access.line.me",
        "exp": 1234567891,
        "iat": 1234567891
      },
      "issuer": "https://access.line.me",
      "sub": "LINE_USER_ID"
    },
    "以下省略": "..."
  }
}

CDKコード

authorizationType: OIDC
oidcProvider: 'https://access.line.me'
clientId: LINE Login Channel ID

を設定することがポイントとなります。

// lib/appsync-stack.ts
import * as appsync from '@aws-cdk/aws-appsync-alpha'
import * as lambdaNodejs from 'aws-cdk-lib/aws-lambda-nodejs'
import * as cdk from 'aws-cdk-lib'
import { Construct } from 'constructs'

export class AppSyncStack extends cdk.Stack {
  constructor(scope: Construct, id: string, props?: cdk.StackProps) {
    super(scope, id, props)

    // AppSyncAPIを作成
    const api = new appsync.GraphqlApi(this, 'myAppsyncApi', {
      name: 'myAppsyncApi',
      schema: appsync.Schema.fromAsset('./schema.graphql'),
      authorizationConfig: {
        defaultAuthorization: {
          authorizationType: appsync.AuthorizationType.OIDC,
          openIdConnectConfig: {
            oidcProvider: 'https://access.line.me',
            clientId: 'LINE_LOGIN_CHANNEL_ID', // LINE Login Channel ID
          },
        },
      },
      xrayEnabled: true,
    })

    // Lambda関数を作成
    const findUserFn = new lambdaNodejs.NodejsFunction(this, 'findUserFn', {
      entry: 'lambda-handler/find-user-handler.ts',
    })

    // Lambda関数をDataSourceとしてAppSyncAPIと紐付ける
    const findUserDs = api.addLambdaDataSource('findUserDs', findUserFn)

    // schema.graphqlで定義した中のどの操作とマッピングするかを指定
    findUserDs.createResolver({
      typeName: 'Query',
      fieldName: 'findUser',
    })
  }
}