Aws-mobile-appsync-sdk-js: CreateAuthLink/CreateSubscriptionHandshakeLink not working from example: https://github.com/awslabs/aws-mobile-appsync-sdk-js#using-authorization-and-subscription-links-with-apollo-client-no-offline-support

Created on 14 Feb 2020  路  8Comments  路  Source: awslabs/aws-mobile-appsync-sdk-js

Note: If your issue/feature-request/question is regarding the AWS AppSync service, please log it in the
official AWS AppSync forum

Do you want to request a feature or report a bug?
Bug

What is the current behavior?
When implementing the example code from https://github.com/awslabs/aws-mobile-appsync-sdk-js#using-authorization-and-subscription-links-with-apollo-client-no-offline-support we receive this typescript error:

Type 'AuthLink' is missing the following properties from type 'ApolloLink': onError, setOnError

Sample code block causing error:

import {
  ApolloClient,
  ApolloLink,
  ApolloProvider,
  HttpLink,
  InMemoryCache
} from '@apollo/client';
import { createSubscriptionHandshakeLink } from 'aws-appsync-subscription-link';
import { createAuthLink } from 'aws-appsync-auth-link';

const link = ApolloLink.from([
  createAuthLink({ url, region, auth }),
  createSubscriptionHandshakeLink({ url, region, auth })
]);

Looking into the Apollo Client code here: https://github.com/apollographql/apollo-client/blob/release-3.0/src/link/core/ApolloLink.ts#L146 it appears that onSetError is required and is not being called by appsync

PS: Also having the same issue with createSubscriptionHandshakeLink

If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem.
See above

What is the expected behavior?
createAuthLink should create a valid auth link and TS should successfully compile

Which versions and which environment (browser, react-native, nodejs) / OS are affected by this issue? Did this work in previous versions?
Previous Versions: N/A
OS: MacOS 10.15.2
Env: Nodejs
Packages:

"@apollo/client": "^3.0.0-beta.34",
"aws-appsync": "^3.0.2",
"aws-appsync-auth-link": "^2.0.1",
"aws-appsync-react": "^3.0.2",
"aws-appsync-subscription-link": "^2.0.1",

auth-link subscription-link

Most helpful comment

As far as I can tell it's because this package extends ApolloLink from the apollo-link package, but for Apollo ^3.0 it should extend ApolloLink from @apollo/client. I've copied the auth-link package in to my own repo because I wanted to make changes to it anyway, but subscription-link has the same issue so I'm probably just going to have to fork it until this repository updates to work with Apollo 3.

Update: Made PR #561 to address this. Should fix this issue.

All 8 comments

For what it's worth these packages worked for me. I'm using the apollo hooks library primarily.

"dependencies": {
    "@apollo/react-hooks": "^3.1.3",
    "apollo-cache-inmemory": "^1.6.5",
    "apollo-client": "2.6.8",
    "apollo-link": "^1.2.13",
    "apollo-link-ws": "^1.0.19",
    "aws-appsync-auth-link": "^2.0.1",
    "aws-appsync-subscription-link": "^2.0.1",
    "graphql-tag": "^2.10.3",
}

Implementation:

const config = {
    url: window.env.REACT_APP_AWS_APPSYNC_GRAPHQL_ENDPOINT,
    region: window.env.REACT_APP_AWS_REGION,
    auth: {
      type: 'AMAZON_COGNITO_USER_POOLS',
      jwtToken: jwtToken,
    },
    disableOffline: true,
  };

  const cache = new InMemoryCache({ addTypename: false }); //apollo-client/issues/1564

  const link = ApolloLink.from([createAuthLink(config), createSubscriptionHandshakeLink(config)]);

  return new ApolloClient({
    link,
    cache,
  });

Thanks @darrenfurr. It looks like you're using an earlier version of apollo-client (v2.x). Has me thinking that appasync hasn't caught up to apollo client v3.x

@archcorsair im using Apollo client 3 just fine

@mikedizon - are you using the same packages & implementation I am?

@darrenfurr

"devDependencies": {
    "@apollo/react-hooks": "^3.1.3",
    "@aws-amplify/api": "^2.1.2",
    "@aws-amplify/pubsub": "^2.1.5",
    "amazon-cognito-identity-js": "^3.2.4",
    "apollo-boost": "^0.4.7",
    "apollo-cache-inmemory": "^1.6.5",
    "apollo-link-http": "^1.5.16"
},
  "dependencies": {
    "@apollo/client": "^3.0.0-beta.37",
    "react-native": "0.61.5"
  }

Not sure why aws-appsync-subscription-link and aws-appsync-subscription-link don't show up in my package.json. I'm definitely importing them. I do use dependabot to keep things up to date.

I'm facing the same issue since I updated apollo client to use version 3:

Type 'AuthLink' is missing the following properties from type 'ApolloLink': onError, setOnError

I see that the type definition for ApolloLink as version 3 includes onError and setOnError, but the type definition in this package does not include them.

What I did as a temporary fix:

const link = ApolloLink.from([
  cleanTypenameLink,
  (createAuthLink({ url, region, auth }) as unknown) as ApolloLink,
  (createSubscriptionHandshakeLink({
    url,
    region,
    auth
  }) as unknown) as ApolloLink
]);

As far as I can tell it's because this package extends ApolloLink from the apollo-link package, but for Apollo ^3.0 it should extend ApolloLink from @apollo/client. I've copied the auth-link package in to my own repo because I wanted to make changes to it anyway, but subscription-link has the same issue so I'm probably just going to have to fork it until this repository updates to work with Apollo 3.

Update: Made PR #561 to address this. Should fix this issue.

Hi,

Support for Apollo 3 in the appsync links is addressed in https://github.com/awslabs/aws-mobile-appsync-sdk-js/pull/561#issuecomment-701696316

Was this page helpful?
0 / 5 - 0 ratings