小能豆

axios 中的 GraphQL 发布请求

javascript

我在使用 GraphQL 时遇到了问题。我想向我的服务器发送 axios.post 请求。我可以在 postman 中执行此操作:

{
    "query":"mutation{updateUserCity(userID: 2, city:\"test\"){id name age city knowledge{language frameworks}}} "
}

在 graphiql 中:

mutation {
  updateUserCity(userID: 2, city: "test") {
    id
    name
    age
    city
    knowledge {
      language
      frameworks
    }
  }
}

但无法在我的代码中做到这一点:((这是我的代码片段:

const data = await axios.post(API_URL, {
  query: mutation updateUserCity(${ id }: Int!, ${ city }: String!) {
    updateUserCity(userID: ${ id }, city: ${ city }){
      id
      name
      age
      city
      knowledge{
        language
        frameworks
      }
    }
  }
}, {
    headers: {
      'Content-Type': 'application/json'
    }
  })

我的代码有什么问题?


阅读 51

收藏
2024-06-25

共2个答案

小能豆

query请求中传递的参数值必须是字符串,传递给 GraphQL 查询的变量名称应以 为前缀$。您已在请求中使用字符串文字作为变量。此外,可以使用variables键在发布请求中传递变量。

将您的代码更改为如下所示的内容应该可以使其正常工作:

const data = await axios.post(API_URL, {
  query: `mutation updateUserCity($id: Int!, $city: String!) {
    updateUserCity(userID: $id, city: $city){
      id
      name
      age
      city
      knowledge{
        language
        frameworks
      }
    }
  }`,
  variables: {
    id: 2,
    city: 'Test'
  }
}, {
    headers: {
      'Content-Type': 'application/json'
    }
  })
2024-06-25
小能豆

像这样传递数据:

const email = "test@gmail.com";
const password = "123";

const data = await axios.post(
  API_URL.Loging,
  {
    query: `query{
      login(
        email:"${email}", 
        password:"${password}"
      )
      {
        userId
        token
      }
    }`,
  }
);

2024-06-25