Closed manwaring closed 5 months ago
Same problem here
Possibly related to #12687 (although that one is REST API).
@daudiihhdau, is your AppSync API managed by Amplify? Or do you also have the GraphQL endpoints managed outside of Amplify?
Yes, I use a CDK stack that uses Appsync to provide an external GraphQL API.
Yesterday I found a solution for my specific problem.
I had forgotten the little keyword "setup" in <script setup>
in my Vue3 application. Now it works.
Ah, nice catch! Thanks for letting us know the cause of the issue, that rules out that this might've been related to the REST API issue, so that's good to know 🙏
@chrisbonifacio I opened this issue and I'm glad it's working now for @daudiihhdau but the issue is still unresolved for my app. My app is also React and not Vue as far as issue tagging for triage/support.
@daudiihhdau was the missing setup
keyword something that is Vue specific, or is this a keyword you needed to include in your Amplify config? I've been searching the Amplify documentation to see if it's something I also missed in my app config but couldn't find anything.
My apologies, @manwaring, I confused who was the OP 😅
Reopened.
I'd be curious to see what the request headers and response look like for the failing graphql queries. Can you share those details from the network activity?
Or is there not even a request being sent? Just the error being thrown?
One other thing that might be worth looking at is the value of authenticated
that determines whether to use cognito or iam. Is it what you'd expect it to be?
Hello,
here is the crucial code snippet from my Vue3 app. Hopefully it will also help with your React app.
import { createApp } from 'vue'
import App from './App.vue'
// https://docs.amplify.aws/javascript/tools/libraries/configure-categories/
import { Amplify } from 'aws-amplify';
import { Hub } from 'aws-amplify/utils';
// configure amplify
import amplifyconfig from '../amplifyconfiguration.json';
const redirectUri = (process.env.NODE_ENV == "development") ? "http://localhost:5173" : "https://dev.XYZ.amplifyapp.com"
let config = {
...amplifyconfig,
"aws_appsync_graphqlEndpoint": "https://abc.appsync-api.eu-central-1.amazonaws.com/graphql",
"aws_appsync_region": "eu-central-1",
"aws_appsync_authenticationType": "AMAZON_COGNITO_USER_POOLS",
"aws_appsync_apiKey": "da2-xyz",
"oauth": {
"domain": "myappname.auth.eu-central-1.amazoncognito.com", // cognito domain
"scope": ['email', 'profile', 'openid'],
"redirectSignIn": redirectUri,
"redirectSignOut": redirectUri,
"responseType": 'code'
},
}
console.log(config)
Amplify.configure(config)
The missing setup keyword is Vue specific. It starts the Vue3 Composition API.
Hey guys, I've had a similar problem, had a long call with AWS support. The claims from Cognito are not sent to lambda in V6. Here is my current AWS config:
Amplify.configure(
{
Auth: {
Cognito: {
region: process.env.AWS_REGION,
userPoolId: process.env.USER_POOL_ID,
userPoolClientId: process.env.USER_POOL_WEB_ID,
},
},
API: {
GraphQL: {
endpoint: process.env.GRAPH_QL_ENDPOINT,
region: process.env.AWS_REGION,
defaultAuthMode: "userPool",
},
},
},
{
API: {
GraphQL: {
headers: async () => ({
Authorization: (await fetchAuthSession()).tokens?.idToken?.toString(),
}),
},
},
},
);
Here also an example GraphQL call:
export const listWebsites = async () => {
const result = await client.graphql({
query: gql`
query listWebsites {
listWebsites {
websiteId
name
createdAt
lastModified
}
}
`,
authMode: 'userPool'
});
return result.data.listWebsites;
};
Maybe it helps someone :)
FWIW anybody who is trying to get unauthenticated identity pool access to use with an external provider if you enable allowGuestAccess: true
in the amplify config fetchAuthSession
will automatically return the session token when not logged in.
For example,
export const config : ResourcesConfig= {
Auth: {
Cognito: {
userPoolId: process.env.NEXT_PUBLIC_COGNITO_USER_POOL_ID!,
userPoolClientId: process.env.NEXT_PUBLIC_COGNITO_CLIENT_ID!,
identityPoolId: process.env.NEXT_PUBLIC_COGNITO_IDENTITY_POOL_ID!,
allowGuestAccess: true,
},
},
}
If your Identity Pool is setup correctly
const session = await fetchAuthSession()
session
will be
{
"credentials": {
"accessKeyId": "KEY_ID",
"secretAccessKey": "ACCESS_KEY",
"sessionToken": "TOKEN",
"expiration": "DATETIME"
},
"identityId": "ap-southeast-2:UUID"
}
and you can check if this session is defined versus a cognito session with a token.
I solved this, by upgrading aws-amplify
to 6.0.16
Thanks @kochie
when making config changes I removed "mandatorySignIn: false" but didn't replace it with "allowGuestAccess: true"
I am having the exact same issue getting an Error: No credentials
when I am calling a Grapql Query that is annotated with @aws_iam only.
With Amplify 5.6 I had no problem accessing this by providing authMode = IAM (as described by the main author of this issue).
Now I use iam
or userPool
. For userPool it works as expected but when I am not authenticated and do a call to an endpoint using my identity pool, it throws that error.
I read through these comments and adding allowGuestAccess: true,
to my awsConfig solved it.
So my question is; is that the recommended solution or is that a shortcut/hack?
@mattiLeBlanc from what I know, there were two different issues folks were running into with iam as an auth mode. Historically, enabling unauthenticated access via the Amplify CLI was a step that could be missed by some and is required for the Amplify graphql client to use the UnauthRole and sign requests. This can also now be enabled on the Amplify configuration using the allowGuestAccess field on the Auth.Cognito resource config option and is the recommended approach.
There was a separate issue regarding using public iam as an auth mode in SSR apps. This was fixed recently in last week's release (v6.0.17).
@chrisbonifacio Just for clarity; I am not using any amplify generated stuff, I just use the Auth lib and Graphql API in my own Angular services. I deploy all my resources (graphql, cognito, dynamo etc) via comprehensive microservices using the AWS CDK. So my configuration for Amplify is pretty manual and simple.
I have a cognito pool and an identity pool for IAM users (non auth) that need to do some things like passwordless login or other no authenticated flows.
So, is setting allowGuestAccess = true the right move for me?
I have this query along with this type:
type Query {
getPublicReadOnlyMediaDownloadUrl(s3Path: String!): SignedUrl @function(name: "getPublicReadOnlyMediaDownloadUrl-${env}") @auth(rules: [{ allow: public, provider: iam }, { allow: private }])
}
type SignedUrl {
url: String!
filename: String!
}
After following the proposed changes/workarounds here and from this closed(why?) issue my unauthenticated user sees the error: "Not Authorized to access url on type SignedUrl"
Is it necessary to configure auth rules on simple types?
EDIT: Client code:
import { generateClient } from "aws-amplify/api";
const client = generateClient();
const response = await this.client.graphql({
query: `query GetPublicReadOnlyMediaDownloadUrl($s3Path: String!) {
getPublicReadOnlyMediaDownloadUrl(s3Path: $s3Path) {
__typename
url
filename
}
}`,
variables: {
s3Path: <S3_PATH>,
},
authMode: 'iam',
});
Edit #2: I worked around my issue by changing the return type from my custom type "SignedUrl" to "String". Would love to understand why this was necessary and if there is a way for me to use my custom type, instead.
Hi @manwaring following up on this issue. It seems the fix has been a bit different for the other users in this thread. I noticed when you opened this issue you were on 6.0.7 and a fix has been released since. Can you try upgrading to the latest version of aws-amplify
and let us know if the issue persists?
Hi 👋 Closing this as we have not heard back from you. If you are still experiencing this issue and in need of assistance, please feel free to comment and provide us with any information previously requested by our team members so we can re-open this issue and be better able to assist you.
Thank you!
Before opening, please confirm:
JavaScript Framework
React
Amplify APIs
Authentication, GraphQL API
Amplify Categories
Not applicable
Environment information
Describe the bug
While upgrading from V5 > V6 I've found a blocker issue / breaking change that I can't find documentation for and am unable to complete the migration without a fix - either in my setup or in the lib.
Error: No credentials at GraphQLAPIClass._headerBasedAuth
Thank you so much for your help with this issue, and my sincerest apologies if I'm missing a step from the upgrade guide - I've tried multiple times going through it but it feels like this could be a config error.
Expected behavior
Reproduction steps
Code Snippet
CloudFormation GraphQL Authentication configuration
React V5 GraphQL call
React V5 Amplify Configuration
React V6 GraphQL call
React V6 Amplify Configuration
Log output
aws-exports.js
No response
Manual configuration
No response
Additional configuration
No response
Mobile Device
No response
Mobile Operating System
No response
Mobile Browser
No response
Mobile Browser Version
No response
Additional information and screenshots
No response