错误:响应不成功:在Next.js应用程序中收到带有GraphQL的状态代码400

Question

我正试图解决在Next.js中使用GraphQL过滤数据的问题。作为后端，我使用Strapi v4。

我的代码看起来像这样。这是pages文件夹中的文件[slug].js，这是用于动态路由的页面。

import React from 'react'
import { Stack } from '@mui/material'
import { gql } from '@apollo/client'
import { client } from '../_app'
const TEACHINGS_BY_SLUG = gql`
query TeachingsBySlug($slug: StringFilterInput){
teachings(filters: {slug: {eq: $slug}}){
data{
id
}
}
}
`
const PageTeaching = ({ teachings }) => {
console.log(teachings)
return (
<Stack alignItems='center'>
some filtered teachings
</Stack>
)
}
export const getStaticProps = async () => {
console.log('revalidation mate...')
const { data } = await client.query({
query: TEACHINGS_BY_SLUG,
variables: {
slug: "teaching1"
}
})
// const response = await fetch('http://localhost:1337/api/teachings?populate=*')
// const data = await response.json()
return {
props: {
teachings: data
},
revalidate: 10
}
}
export const getStaticPaths = async () => {
return {
paths: [{
params: { slug: "teaching1" }
}],
fallback: false
}
}
// export const getServerSideProps = async () => {
//     const { data } = await client.query({
//         query: TEACHINGS_BY_SLUG,
//         variables: {
//             slug: "teaching1"
//         }
//     })
//     return {
//         props: {
//             teachings: data
//         }
//     }
// }
export default PageTeaching

我得到了错误400(如上面的标题所示(，我知道情况应该在这两行中：

query TeachingsBySlug($slug: StringFilterInput){
teachings(filters: {slug: {eq: $slug}}){

因为没有添加过滤器变量，一切都可以。我想这可能是一些错误的符号，但我不知道。

我可能会使用getServerSideProps而不是getStaticProps/getStaticPaths，但我认为这与过滤本身没有任何区别。

Answer 1

已解决

我解决了我的错误。我错误地传递了错误的模式名称。而不是通过"；StringFilterInput"；架构名称，我应该只传递"；字符串"架构名称。