我正在尝试将我的Next.js应用部署到Vercel,部署/构建“成功”,但如果我访问该网站,它会指出存在应用程序错误。
x1c 0d1x的数据
当我检查控制台时它显示
错误:服务器组件呈现中发生错误。在生产构建中省略了特定的消息,以避免泄漏敏感的详细信息。此错误示例中包含摘要属性,它可以提供有关错误性质的其他详细信息。
当我检查Vercel部署日志时,它显示部署成功,但是GET请求返回此错误
- info Loaded env from /var/task/.env
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/147.js:191:16)
at async Home (/var/task/.next/server/app/page.js:607: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: '1254291344'
}
字符串
这是令人惊讶的,因为当我执行npm run dev
时,整个项目都在本地工作。发生这种情况是因为目前在graphQL中没有要查找的“项目”,所以当尝试搜索类别时返回错误并接收null吗?还是我的.ENV变量搞砸了?
grafbase.config.ts:
import { g, config, auth } from "@grafbase/sdk";
// @ts-ignore
const User = g
.model("User", {
name: g.string().length({ min: 2, max: 100 }),
email: g.string().unique(),
avatarUrl: g.url(),
description: g.string().length({ min: 2, max: 1000 }).optional(),
githubUrl: g.url().optional(),
linkedinUrl: g.url().optional(),
projects: g
.relation(() => Project)
.list()
.optional(),
})
.auth((rules) => {
rules.public().read();
});
// @ts-ignore
const Project = g
.model("Project", {
title: g.string().length({ min: 3 }),
description: g.string(),
image: g.url(),
liveSiteUrl: g.url(),
githubUrl: g.url(),
category: g.string().search(),
createdBy: g.relation(() => User),
})
.auth((rules) => {
rules.public().read();
rules.private().create().delete().update();
});
const jwt = auth.JWT({
issuer: "grafbase",
secret: g.env("NEXTAUTH_SECRET"),
});
export default config({
schema: g,
auth: {
providers: [jwt],
rules: (rules) => rules.private(),
},
});
型
我已经在本地测试了我的项目,除了NEXTAUTH_URL之外,所有相同的.ENV变量都反映了新的Vercel URL,而不是localhost:3000。我已经确保我的Graf base部署是成功的,环境变量是正确的
我还检查了我的cloudinary,google cloud和NEXTAUTH .env变量,以确保它们是正确的,并在Vercel部署内。我已经确保我的谷歌云授权URL是正确的,所需的.env变量是正确的。
不确定我可以添加什么其他上下文,或者是否有任何其他我应该检查,它可能是空类别,但不确定如何修复,以及为什么它可以在本地工作,但不能在生产。这是我的github以防万一。github
2条答案
按热度按时间lyr7nygr1#
我发现防止这个错误的唯一方法是,如果没有选择任何类别,则将所有可用的categoryFilters的列表传递给GraphQL查询。
这样,当没有选择特定类别时,主页将显示所有可用项目类别的项目。
将$category重命名为$categories。类型应为必填字符串列表。
字符串
如果未选择类别,则创建类别列表。
型
fcy6dtqo2#
我在Vercel上部署它时遇到了同样的错误。
我发现防止类别错误的唯一方法是向类别添加一个空字符串。
$category:String =“",$endcursor:字符串)
此方法允许您部署站点。
具有类别的项目不会显示在主页上。只有没有类别的项目才会显示在主页上。但是,当您选择特定类别时,将显示相关项目。