adrianhajdin / project_nextjs13_flexibble

https://jsmastery.pro
649 stars 139 forks source link

Error: GraphQL Error (Code: 200): #20

Closed piglitch closed 1 year ago

piglitch commented 1 year ago

Error: GraphQL Error (Code: 200): {"response":{"error":"{\"data\":null,\"errors\":[{\"message\":\"Unauthorized\"}]}","status":200,"headers":{"map":{"content-length":"51","content-type":"text/xml"}}},"request":{"query":"\n\tmutation CreateProject($input: ProjectCreateInput!) {\n\t\tprojectCreate(input: $input) {\n\t\t\tproject {\n\t\t\t\tid\n\t\t\t\ttitle\n\t\t\t\tdescription\n\t\t\t\tcreatedBy {\n\t\t\t\t\temail\n\t\t\t\t\tname\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n","variables":{"input":{"title":"jdgj","description":"djGDJ","image":"http://res.cloudinary.com/djzh0decn/image/upload/v1689633257/nxmwx4ikbcbly9cmglft.png","category":"","createdBy":{"link":"user_01H4KEB5YXHB02M6M6EC9N08Y1"}}}}} at makeRequest (webpack-internal:///(:3000/app-client)/./node_modules/graphql-request/build/esm/index.js:301:15) at async makeGraphQLRequest (webpack-internal:///(:3000/app-client)/./lib/actions.ts:43:16) at async handleFormSubmit (webpack-internal:///(:3000/app-client)/./components/ProjectForm.tsx:35:17)

piglitch commented 1 year ago

I do not know how this is appearing, I have checked all the credentials.

piglitch commented 1 year ago

import { GraphQLClient} from "graphql-request"; import { createProjectMutation, createUserMutation, getUserQuery } from "@/graphql"; import { ProjectForm } from "@/common.type";

const isProduction = process.env.NODE_ENV === 'production'; const apiUrl = isProduction ? process.env.NEXT_PUBLIC_GRAFBASE_API_URL || '' : 'http://127.0.0.1:4000/graphql'; const apiKey = isProduction ? process.env.NEXT_PUBLIC_GRAFBASE_API_KEY || '' : 'letmein';

const serverUrl = isProduction ? process.env.NEXT_PUBLIC_SERVER_URL : 'http://localhost:3000/'

const clientOptions = { headers: { 'x-api-key': apiKey, }, };

const client = new GraphQLClient(apiUrl, clientOptions)

export const fetchToken = async () => { try { const response = await fetch(${serverUrl}/api/auth/token); return response.json(); } catch (error) { throw error } };

export const uploadImage = async (imagePath: string) => { try { const response = await fetch(${serverUrl}/api/upload, { method: 'POST', body: JSON.stringify({ path: imagePath, }), }); return response.json(); } catch (error) { throw error; } }

const makeGraphQLRequest = async (query: string, variables = {}, headers = {}) => { try { return await client.request(query, variables, headers); } catch (error) { throw error; } };

export const createNewProject = async (form: ProjectForm, creatorId: string, token: string) => { const imageUrl = await uploadImage(form.image); if (imageUrl.url) {

const headers = { Authorization: Bearer ${token} }; const variables = { input: { ...form, image: imageUrl.url, createdBy: { link: creatorId } } }; return makeGraphQLRequest(createProjectMutation, variables, headers); } };

export const createUser = (name: string, email: string, avatarUrl: string) => { client.setHeader('x-api-key', apiKey); const variables = { input: { name, email, avatarUrl }, }; return makeGraphQLRequest(createUserMutation, variables) }

export const getUser = (email: string) => { client.setHeader('x-api-key', apiKey); return makeGraphQLRequest(getUserQuery, { email }) }

piglitch commented 1 year ago

import { GraphQLClient} from "graphql-request"; import { createProjectMutation, createUserMutation, getUserQuery } from "@/graphql"; import { ProjectForm } from "@/common.type";

const isProduction = process.env.NODE_ENV === 'production'; const apiUrl = isProduction ? process.env.NEXT_PUBLIC_GRAFBASE_API_URL || '' : 'http://127.0.0.1:4000/graphql'; const apiKey = isProduction ? process.env.NEXT_PUBLIC_GRAFBASE_API_KEY || '' : 'letmein';

const serverUrl = isProduction ? process.env.NEXT_PUBLIC_SERVER_URL : 'http://localhost:3000/'

const clientOptions = { headers: { 'x-api-key': apiKey, }, };

const client = new GraphQLClient(apiUrl, clientOptions)

export const fetchToken = async () => { try { const response = await fetch(${serverUrl}/api/auth/token); return response.json(); } catch (error) { throw error } };

export const uploadImage = async (imagePath: string) => { try { const response = await fetch(${serverUrl}/api/upload, { method: 'POST', body: JSON.stringify({ path: imagePath, }), }); return response.json(); } catch (error) { throw error; } }

const makeGraphQLRequest = async (query: string, variables = {}, headers = {}) => { try { return await client.request(query, variables, headers); } catch (error) { throw error; } };

export const createNewProject = async (form: ProjectForm, creatorId: string, token: string) => { const imageUrl = await uploadImage(form.image); if (imageUrl.url) {

const headers = { Authorization: Bearer ${token} }; const variables = { input: { ...form, image: imageUrl.url, createdBy: { link: creatorId } } }; return makeGraphQLRequest(createProjectMutation, variables, headers); } };

export const createUser = (name: string, email: string, avatarUrl: string) => { client.setHeader('x-api-key', apiKey); const variables = { input: { name, email, avatarUrl }, }; return makeGraphQLRequest(createUserMutation, variables) }

export const getUser = (email: string) => { client.setHeader('x-api-key', apiKey); return makeGraphQLRequest(getUserQuery, { email }) }

This works!

6little6fang6 commented 1 year ago

import { GraphQLClient} from "graphql-request"; import { createProjectMutation, createUserMutation, getUserQuery } from "@/graphql"; import { ProjectForm } from "@/common.type"; const isProduction = process.env.NODE_ENV === 'production'; const apiUrl = isProduction ? process.env.NEXT_PUBLIC_GRAFBASE_API_URL || '' : 'http://127.0.0.1:4000/graphql'; const apiKey = isProduction ? process.env.NEXT_PUBLIC_GRAFBASE_API_KEY || '' : 'letmein'; const serverUrl = isProduction ? process.env.NEXT_PUBLIC_SERVER_URL : 'http://localhost:3000/' const clientOptions = { headers: { 'x-api-key': apiKey, }, }; const client = new GraphQLClient(apiUrl, clientOptions) export const fetchToken = async () => { try { const response = await fetch(${serverUrl}/api/auth/token); return response.json(); } catch (error) { throw error } }; export const uploadImage = async (imagePath: string) => { try { const response = await fetch(${serverUrl}/api/upload, { method: 'POST', body: JSON.stringify({ path: imagePath, }), }); return response.json(); } catch (error) { throw error; } } const makeGraphQLRequest = async (query: string, variables = {}, headers = {}) => { try { return await client.request(query, variables, headers); } catch (error) { throw error; } }; export const createNewProject = async (form: ProjectForm, creatorId: string, token: string) => { const imageUrl = await uploadImage(form.image); if (imageUrl.url) { const headers = { Authorization: Bearer ${token} }; const variables = { input: { ...form, image: imageUrl.url, createdBy: { link: creatorId } } }; return makeGraphQLRequest(createProjectMutation, variables, headers); } }; export const createUser = (name: string, email: string, avatarUrl: string) => { client.setHeader('x-api-key', apiKey); const variables = { input: { name, email, avatarUrl }, }; return makeGraphQLRequest(createUserMutation, variables) } export const getUser = (email: string) => { client.setHeader('x-api-key', apiKey); return makeGraphQLRequest(getUserQuery, { email }) }

This works!

BASED

piglitch commented 1 year ago

import { GraphQLClient} from "graphql-request"; import { createProjectMutation, createUserMutation, getUserQuery } from "@/graphql"; import { ProjectForm } from "@/common.type"; const isProduction = process.env.NODE_ENV === 'production'; const apiUrl = isProduction ? process.env.NEXT_PUBLIC_GRAFBASE_API_URL || '' : 'http://127.0.0.1:4000/graphql'; const apiKey = isProduction ? process.env.NEXT_PUBLIC_GRAFBASE_API_KEY || '' : 'letmein'; const serverUrl = isProduction ? process.env.NEXT_PUBLIC_SERVER_URL : 'http://localhost:3000/' const clientOptions = { headers: { 'x-api-key': apiKey, }, }; const client = new GraphQLClient(apiUrl, clientOptions) export const fetchToken = async () => { try { const response = await fetch(${serverUrl}/api/auth/token); return response.json(); } catch (error) { throw error } }; export const uploadImage = async (imagePath: string) => { try { const response = await fetch(${serverUrl}/api/upload, { method: 'POST', body: JSON.stringify({ path: imagePath, }), }); return response.json(); } catch (error) { throw error; } } const makeGraphQLRequest = async (query: string, variables = {}, headers = {}) => { try { return await client.request(query, variables, headers); } catch (error) { throw error; } }; export const createNewProject = async (form: ProjectForm, creatorId: string, token: string) => { const imageUrl = await uploadImage(form.image); if (imageUrl.url) { const headers = { Authorization: Bearer ${token} }; const variables = { input: { ...form, image: imageUrl.url, createdBy: { link: creatorId } } }; return makeGraphQLRequest(createProjectMutation, variables, headers); } }; export const createUser = (name: string, email: string, avatarUrl: string) => { client.setHeader('x-api-key', apiKey); const variables = { input: { name, email, avatarUrl }, }; return makeGraphQLRequest(createUserMutation, variables) } export const getUser = (email: string) => { client.setHeader('x-api-key', apiKey); return makeGraphQLRequest(getUserQuery, { email }) }

This works!

BASED

What does 'BASED' mean?

6little6fang6 commented 1 year ago

It means different things depending of context. In this case I am trying to convey how over the top your skills are since I ran in the same situation and I could´t solve it by myself. A simple thank you would have been better tho.

piglitch commented 1 year ago

It means different things depending of context. In this case I am trying to convey how over the top your skills are since I ran in the same situation and I could´t solve it by myself. A simple thank you would have been better tho.

Ohh. Thanks for the thanks ig 😂