I created the following query in graphcms and it works in the graphql playground but when I transfer the query to my react code and try to access graphcms I get a 403 error shown below.
The query:
import { request, gql } from 'graphql-request';
const graphqlAPI = process.env.NEXT_PUBLIC_GRAPHCMS_ENDPOINT;
export const getPosts = async () => {
const query = gql`
query MyQuery {
postsConnection {
edges {
node {
author {
bio
id
name
photo {
url
}
post {
categories {
name
slug
}
}
}
createdAt
slug
title
excerpt
featureImage {
url
}
}
}
}
}
`;
const result = await request(graphqlAPI, query);
return result.postsConnection.edges;
The error:
Error: not allowed: {"response":{"errors":[{"message":"not allowed","extensions":
{"code":"403","path":["postsConnection","edges"]}}],"data":{"postsConnection":{"edges":[]}},"status":200,"headers":{}},"request":{"query":"\n query MyQuery {\n postsConnection {\n edges {\n node {\n author {\n bio\n id\n name\n photo {\n url\n }\n post {\n categories {\n name\n slug\n }\n }\n }\n createdAt\n slug\n title\n excerpt\n featureImage {\n url\n }\n }\n }\n }\n }\n \n "}}
};