search

adrianhajdin / project_nextjs13_flexibble

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

Application error: a server-side exception has occurred (see the server logs for more information). #21

Open amanmukati09 opened 1 year ago

amanmukati09 commented 1 year ago

ClientError: Field 'category': Error { message: "Field 'category': Error { message: \"invalid type: null, expected a string\", extensions: None }", extensions: None }: {"response":{"data":null,"errors":[{"message":"Field 'category': Error { message: \"Field 'category': Error { message: \\"invalid type: null, expected a string\\", extensions: None }\", extensions: None }","locations":[{"line":3,"column":5}],"path":["projectSearch"]}],"status":200,"headers":{}},"request":{"query":"\n query getProjects($category: String, $endcursor: String) {\n projectSearch(first: 8, after: $endcursor, filter: {category: {eq: $category}}) {\n pageInfo {\n hasNextPage\n hasPreviousPage\n startCursor\n endCursor\n }\n edges {\n node {\n title\n githubUrl\n description\n liveSiteUrl\n id\n image\n category\n createdBy {\n id\n email\n name\n avatarUrl\n }\n }\n }\n }\n }\n","variables":{}}} at makeRequest (/var/task/node_modules/graphql-request/build/cjs/index.js:310:15) at process.processTicksAndRejections (node:internal/process/task_queues:95:5) at async makeGraphQLRequest (/var/task/.next/server/chunks/634.js:191:16) at async Home (/var/task/.next/server/app/page.js:645:18) { response: { data: null, errors: [ [Object] ], status: 200, headers: Headers { [Symbol(map)]: [Object: null prototype] } }, request: { query: '\n' + ' query getProjects($category: String, $endcursor: String) {\n' + ' projectSearch(first: 8, after: $endcursor, filter: {category: {eq: $category}}) {\n' + ' pageInfo {\n' + ' hasNextPage\n' + ' hasPreviousPage\n' + ' startCursor\n' + ' endCursor\n' + ' }\n' + ' edges {\n' + ' node {\n' + ' title\n' + ' githubUrl\n' + ' description\n' + ' liveSiteUrl\n' + ' id\n' + ' image\n' + ' category\n' + ' createdBy {\n' + ' id\n' + ' email\n' + ' name\n' + ' avatarUrl\n' + ' }\n' + ' }\n' + ' }\n' + ' }\n' + ' }\n', variables: { category: undefined, endcursor: undefined } } } [Error: An error occurred in the Server Components render. The specific message is omitted in production builds to avoid leaking sensitive details. A digest property is included on this error instance which may provide additional details about the nature of the error.] { digest: '2723824341' }

lucmanm commented 1 year ago

We need support from here what is the issue.

mdixon47 commented 1 year ago

I am having the very same problem. I have checked all of the environmental variables in the .env files and placed them in the environmental settings of Versel and Netlify. As amanmukati09 commented yesterday, The error seems to be a server-side rendering issue that does not have any specific details about the error in production builds to maintain security. I am guessing that this is a WebGL security issue that is causing the problems although the Grafbase may have the URL and the key in the environment file. Could we be missing any API security keys in Grafbase?

ProgrammerOwais commented 1 year ago

having the same issue, plz let me know if you gys got any solution

ProgrammerOwais commented 1 year ago

ClientError: Field 'category': Error { message: "Field 'category': Error { message: "invalid type: null, expected a string", extensions: None }", extensions: None }: {"response":{"data":null,"errors":[{"message":"Field 'category': Error { message: "Field 'category': Error { message: \"invalid type: null, expected a string\", extensions: None }", extensions: None }","locations":[{"line":3,"column":5}],"path":["projectSearch"]}],"status":200,"headers":{}},"request":{"query":"\n query getProjects($category: String, $endcursor: String) {\n projectSearch(first: 8, after: $endcursor, filter: {category: {eq: $category}}) {\n pageInfo {\n hasNextPage\n hasPreviousPage\n startCursor\n endCursor\n }\n edges {\n node {\n title\n githubUrl\n description\n liveSiteUrl\n id\n image\n category\n createdBy {\n id\n email\n name\n avatarUrl\n }\n }\n }\n }\n }\n","variables":{}}} at makeRequest (/var/task/node_modules/graphql-request/build/cjs/index.js:310:15) at process.processTicksAndRejections (node:internal/process/task_queues:95:5) at async makeGraphQLRequest (/var/task/.next/server/chunks/634.js:191:16) at async Home (/var/task/.next/server/app/page.js:645:18) { response: { data: null, errors: [ [Object] ], status: 200, headers: Headers { [Symbol(map)]: [Object: null prototype] } }, request: { query: '\n' + ' query getProjects($category: String, $endcursor: String) {\n' + ' projectSearch(first: 8, after: $endcursor, filter: {category: {eq: $category}}) {\n' + ' pageInfo {\n' + ' hasNextPage\n' + ' hasPreviousPage\n' + ' startCursor\n' + ' endCursor\n' + ' }\n' + ' edges {\n' + ' node {\n' + ' title\n' + ' githubUrl\n' + ' description\n' + ' liveSiteUrl\n' + ' id\n' + ' image\n' + ' category\n' + ' createdBy {\n' + ' id\n' + ' email\n' + ' name\n' + ' avatarUrl\n' + ' }\n' + ' }\n' + ' }\n' + ' }\n' + ' }\n', variables: { category: undefined, endcursor: undefined } } } [Error: An error occurred in the Server Components render. The specific message is omitted in production builds to avoid leaking sensitive details. A digest property is included on this error instance which may provide additional details about the nature of the error.] { digest: '2723824341' }

I have solved it, here is how first you will need to create two queries one for all projects without category option `` export const projectsQueryAll = query getProjects( $endcursor: String) { projectSearch(first: 8, after: $endcursor) { pageInfo { hasNextPage hasPreviousPage startCursor endCursor } .... .... }

and one with category filter


export const projectsQueryWithFilter = `
query getProjects($category: String, $endcursor: String) {
  projectSearch(first: 8, after: $endcursor, filter: {category: {eq: $category}}) {
    pageInfo {
      hasNextPage
      hasPreviousPage
      startCursor
      endCursor
    }
.....
....
}

and then in the action.ts you have to change the code like this
![Screenshot (7)](https://github.com/adrianhajdin/project_nextjs13_flexibble/assets/86137698/ff393ef3-5423-44a5-a5dc-0b14b91f54ba)

Also the most important, make sure to check all the environment variables , in development, in grafbase & in production
I hope you all will find this helpful,
have a great day.
ProgrammerOwais commented 1 year ago

ClientError: Field 'category': Error { message: "Field 'category': Error { message: "invalid type: null, expected a string", extensions: None }", extensions: None }: {"response":{"data":null,"errors":[{"message":"Field 'category': Error { message: "Field 'category': Error { message: "invalid type: null, expected a string", extensions: None }", extensions: None }","locations":[{"line":3,"column":5}],"path":["projectSearch"]}],"status":200,"headers":{}},"request":{"query":"\n query getProjects($category: String, $endcursor: String) {\n projectSearch(first: 8, after: $endcursor, filter: {category: {eq: $category}}) {\n pageInfo {\n hasNextPage\n hasPreviousPage\n startCursor\n endCursor\n }\n edges {\n node {\n title\n githubUrl\n description\n liveSiteUrl\n id\n image\n category\n createdBy {\n id\n email\n name\n avatarUrl\n }\n }\n }\n }\n }\n","variables":{}}} at makeRequest (/var/task/node_modules/graphql-request/build/cjs/index.js:310:15) at process.processTicksAndRejections (node:internal/process/task_queues:95:5) at async makeGraphQLRequest (/var/task/.next/server/chunks/634.js:191:16) at async Home (/var/task/.next/server/app/page.js:645:18) { response: { data: null, errors: [ [Object] ], status: 200, headers: Headers { [Symbol(map)]: [Object: null prototype] } }, request: { query: '\n' + ' query getProjects($category: String, $endcursor: String) {\n' + ' projectSearch(first: 8, after: $endcursor, filter: {category: {eq: $category}}) {\n' + ' pageInfo {\n' + ' hasNextPage\n' + ' hasPreviousPage\n' + ' startCursor\n' + ' endCursor\n' + ' }\n' + ' edges {\n' + ' node {\n' + ' title\n' + ' githubUrl\n' + ' description\n' + ' liveSiteUrl\n' + ' id\n' + ' image\n' + ' category\n' + ' createdBy {\n' + ' id\n' + ' email\n' + ' name\n' + ' avatarUrl\n' + ' }\n' + ' }\n' + ' }\n' + ' }\n' + ' }\n', variables: { category: undefined, endcursor: undefined } } } [Error: An error occurred in the Server Components render. The specific message is omitted in production builds to avoid leaking sensitive details. A digest property is included on this error instance which may provide additional details about the nature of the error.] { digest: '2723824341' }

I have solved it, here is how first you will need to create two queries one for all projects without category option `` export const projectsQueryAll = query getProjects( $endcursor: String) { projectSearch(first: 8, after: $endcursor) { pageInfo { hasNextPage hasPreviousPage startCursor endCursor } .... .... }

and one with category filter

export const projectsQueryWithFilter = `
query getProjects($category: String, $endcursor: String) {
  projectSearch(first: 8, after: $endcursor, filter: {category: {eq: $category}}) {
    pageInfo {
      hasNextPage
      hasPreviousPage
      startCursor
      endCursor
    }
.....
....
}

and then in the action.ts you have to change the code like this
![Screenshot (7)](https://github.com/adrianhajdin/project_nextjs13_flexibble/assets/86137698/ff393ef3-5423-44a5-a5dc-0b14b91f54ba)

Also the most important, make sure to check all the environment variables , in development, in grafbase & in production
I hope you all will find this helpful,
have a great day.

Screenshot (7)

kanish-10 commented 1 year ago

I saw your (ProgrammerOwais) solution and started implementing it. No doubt it solves the error with deployment but the main issue is still the same projects aren't showing and filtering isn't working.

lucmanm commented 1 year ago

I solve mine by below same issue by category link https://github.com/adrianhajdin/project_nextjs13_flexibble/issues/13

image

Wait at least 2-5 minutes to re update.

kanish-10 commented 1 year ago

It actually doesnt solve the issue create a project you wont see it on the main page and even the category isnt working.

On Sat, 22 Jul 2023, 16:01 Mahid C. Lucman, @.***> wrote:

I solve mine by below same issue by category link https://github.com/adrianhajdin/project_nextjs13_flexibble/issues/13

[image: image] https://user-images.githubusercontent.com/113641595/255324789-df5b343e-45af-4652-a516-4c46554fcc8f.png

Reference ![image]( https://github.com/adrianhajdin/project_nextjs13_flexibble/assets/1

— Reply to this email directly, view it on GitHub https://github.com/adrianhajdin/project_nextjs13_flexibble/issues/21#issuecomment-1646552662, or unsubscribe https://github.com/notifications/unsubscribe-auth/A3UARR7JC6ZWAKXBNSUEWWTXROTWPANCNFSM6AAAAAA2OJORNI . You are receiving this because you commented.Message ID: @.***>

lucmanm commented 1 year ago

It actually doesnt solve the issue create a project you wont see it on the main page and even the category isnt working. … On Sat, 22 Jul 2023, 16:01 Mahid C. Lucman, @.> wrote: I solve mine by below same issue by category link #13 [image: image] https://user-images.githubusercontent.com/113641595/255324789-df5b343e-45af-4652-a516-4c46554fcc8f.png Reference ![image]( https://github.com/adrianhajdin/project_nextjs13_flexibble/assets/1 — Reply to this email directly, view it on GitHub <#21 (comment)>, or unsubscribe https://github.com/notifications/unsubscribe-auth/A3UARR7JC6ZWAKXBNSUEWWTXROTWPANCNFSM6AAAAAA2OJORNI . You are receiving this because you commented.Message ID: @.>

it is now active Bro, Check your page now. https://flexibble-f3d41tfbr-kanish-10.vercel.app/

kanish-10 commented 1 year ago

Yes it is active but i have a project in there of Full stack category can you see it???

On Sat, 22 Jul 2023, 21:21 Mahid C. Lucman, @.***> wrote:

It actually doesnt solve the issue create a project you wont see it on the main page and even the category isnt working. … <#m9155760614960208878> On Sat, 22 Jul 2023, 16:01 Mahid C. Lucman, @.> wrote: I solve mine by below same issue by category link #13 https://github.com/adrianhajdin/project_nextjs13_flexibble/issues/13 [image: image] https://user-images.githubusercontent.com/113641595/255324789-df5b343e-45af-4652-a516-4c46554fcc8f.png https://user-images.githubusercontent.com/113641595/255324789-df5b343e-45af-4652-a516-4c46554fcc8f.png Reference ![image]( https://github.com/adrianhajdin/project_nextjs13_flexibble/assets/1 https://github.com/adrianhajdin/project_nextjs13_flexibble/assets/1 — Reply to this email directly, view it on GitHub <#21 (comment) https://github.com/adrianhajdin/project_nextjs13_flexibble/issues/21#issuecomment-1646552662>, or unsubscribe https://github.com/notifications/unsubscribe-auth/A3UARR7JC6ZWAKXBNSUEWWTXROTWPANCNFSM6AAAAAA2OJORNI https://github.com/notifications/unsubscribe-auth/A3UARR7JC6ZWAKXBNSUEWWTXROTWPANCNFSM6AAAAAA2OJORNI . You are receiving this because you commented.Message ID: @.>

it is now active Bro, Check your page now. https://flexibble-f3d41tfbr-kanish-10.vercel.app/

— Reply to this email directly, view it on GitHub https://github.com/adrianhajdin/project_nextjs13_flexibble/issues/21#issuecomment-1646613785, or unsubscribe https://github.com/notifications/unsubscribe-auth/A3UARR7GRGAKEOR2OM6DY7TXRPZJJANCNFSM6AAAAAA2OJORNI . You are receiving this because you commented.Message ID: @.***>