2017-06-17 14 views
2

GraphQLクエリでPOSTリクエストを作成しようとしていますが、私のリクエストがPostManで動作しても、エラーMust provide query stringが返されています。ここでGraphqlクエリを使用したノード取り出しリクエスト

は、私はそれが郵便配達で実行されている方法です。

enter image description here

enter image description here

そして、ここでは、私は自分のアプリケーションで実行しているコードです:

const url = `http://localhost:3000/graphql`;  
return fetch(url, { 
    method: 'POST', 
    Accept: 'api_version=2', 
    'Content-Type': 'application/graphql', 
    body: ` 
    { 
     users(name: "Thomas") { 
     firstName 
     lastName 
     } 
    } 
    ` 
}) 
.then(response => response.json()) 
.then(data => { 
    console.log('Here is the data: ', data); 
    ... 
}); 

任意のアイデア私は間違っているの? fetchリクエストで渡してきたボディ属性が、Postmanリクエストの本文に指定したようにTextという形式になるようにすることはできますか?

答えて

6

本文には、クエリ文字列を含むqueryプロパティが必要です。他のvariableプロパティも渡すことができ、クエリのGraphQL変数も送信できます。これはあなたのケースで動作するはず

const url = `http://localhost:3000/graphql`; 
const query = ` 
    { 
    users(name: "Thomas") { 
     firstName 
     lastName 
    } 
    } 
` 

return fetch(url, { 
    method: 'POST', 
    Accept: 'api_version=2', 
    'Content-Type': 'application/graphql', 
    body: JSON.stringify({ query }) 
}) 
.then(response => response.json()) 
.then(data => { 
    console.log('Here is the data: ', data); 
    ... 
}); 

これはGraphQL変数を送信する方法である:

const query = ` 
    query movies($first: Int!) { 
    allMovies(first: $first) { 
     title 
    } 
    } 
` 

const variables = { 
    first: 3 
} 

return fetch('https://api.graph.cool/simple/v1/cixos23120m0n0173veiiwrjr', { 
    method: 'post', 
    headers: { 
    'Content-Type': 'application/json', 
    }, 
    body: JSON.stringify({query, variables}) 
}) 
.then(response => response.json()) 
.then(data => { 
    return data 
}) 
.catch((e) => { 
    console.log(e) 
}) 

私はa complete example on GitHubを作成しました。

関連する問題