Page updated Jan 16, 2024

Use existing AWS resources

Re-use existing AppSync GraphQL API

As an alternative to automatic configuration, you can manually enter AWS AppSync configuration parameters in your app. Authentication type options are API_KEY, AWS_IAM, AMAZON_COGNITO_USER_POOLS and OPENID_CONNECT.

Using API_KEY

1const myAppConfig = {
2 // ...
3 aws_appsync_graphqlEndpoint:
4 'https://xxxxxx.appsync-api.us-east-1.amazonaws.com/graphql',
5 aws_appsync_region: 'us-east-1',
6 aws_appsync_authenticationType: 'API_KEY',
7 aws_appsync_apiKey: 'da2-xxxxxxxxxxxxxxxxxxxxxxxxxx'
8 // ...
9};
10
11Amplify.configure(myAppConfig);

Using AWS_IAM

1const myAppConfig = {
2 // ...
3 aws_appsync_graphqlEndpoint:
4 'https://xxxxxx.appsync-api.us-east-1.amazonaws.com/graphql',
5 aws_appsync_region: 'us-east-1',
6 aws_appsync_authenticationType: 'AWS_IAM'
7 // ...
8};
9
10Amplify.configure(myAppConfig);

Using AMAZON_COGNITO_USER_POOLS

1const myAppConfig = {
2 // ...
3 aws_appsync_graphqlEndpoint:
4 'https://xxxxxx.appsync-api.us-east-1.amazonaws.com/graphql',
5 aws_appsync_region: 'us-east-1',
6 aws_appsync_authenticationType: 'AMAZON_COGNITO_USER_POOLS' // You have configured Auth with Amazon Cognito User Pool ID and Web Client Id
7 // ...
8};
9
10Amplify.configure(myAppConfig);

Using OPENID_CONNECT

1const myAppConfig = {
2 // ...
3 aws_appsync_graphqlEndpoint:
4 'https://xxxxxx.appsync-api.us-east-1.amazonaws.com/graphql',
5 aws_appsync_region: 'us-east-1',
6 aws_appsync_authenticationType: 'OPENID_CONNECT' // Before calling API.graphql(...) is required to do Auth.federatedSignIn(...) check authentication guide for details.
7 // ...
8};
9
10Amplify.configure(myAppConfig);

Using with an AppSync custom domain name

Custom domain names can have any format, but must end with /graphql (see https://graphql.org/learn/serving-over-http/#uris-routes).

1const myAppConfig = {
2 // ...
3 aws_appsync_graphqlEndpoint: 'https://api.yourdomain.com/graphql',
4 aws_appsync_region: 'us-east-1',
5 aws_appsync_authenticationType: 'API_KEY' // All auth modes are supported
6 // ...
7};
8
9Amplify.configure(myAppConfig);

Using a non-AppSync GraphQL Server

To access a non-AppSync GraphQL API with your app, you need to configure the endpoint URL in your app’s configuration. Add the following line to your setup:

1import { Amplify, API } from 'aws-amplify';
2import awsconfig from './aws-exports';
3
4// Considering you have an existing aws-exports.js configuration file
5Amplify.configure(awsconfig);
6
7// Configure a custom GraphQL endpoint
8Amplify.configure({
9 API: {
10 graphql_endpoint: 'https:/www.example.com/my-graphql-endpoint'
11 }
12});

Set Custom Request Headers for non-AppSync GraphQL APIs

When working with a non-AppSync GraphQL endpoint, you may need to set request headers for authorization purposes. This is done by passing a graphql_headers function into the configuration:

1Amplify.configure({
2 API: {
3 graphql_headers: async () => ({
4 'My-Custom-Header': 'my value'
5 })
6 }
7});

Signing Request with IAM

AWS Amplify provides the ability to sign requests automatically with AWS Identity Access Management (IAM) for GraphQL requests that are processed through AWS API Gateway. Add the graphql_endpoint_iam_region parameter to your GraphQL configuration statement to enable signing:

1Amplify.configure({
2 API: {
3 graphql_endpoint: 'https://www.example.com/my-graphql-endpoint',
4 graphql_endpoint_iam_region: 'my_graphql_apigateway_region'
5 }
6});