2017-03-22 57 views
1

我在我的web服務器上使用apollo-client與我的graphql服務器(也是apollo)進行通信。我有一個成功的查詢工作和正確檢索數據,但是當我嘗試突變時,我收到new ApolloError消息。相同的突變複製/粘貼到graphiql完美的作品。apollo-client服務器到服務器突變導致錯誤(查詢正常)

我檢查了我的graphql服務器上的CORS,它已啓用並正常運行。我從字面上複製並將代碼中的變體粘貼到我的graphiql編輯器中,並且按預期工作。

有人可以爲我解釋一些這方面的信息,或者指導我如何在我的graphql-server上看到更多信息,爲什麼我會收到400錯誤?

這裏是阿波羅錯誤

{ 
    "graphQLErrors": [], 
    "networkError": { 
    "response": { 
     "url": "http://localhost:9000/api/private", 
     "status": 400, 
     "statusText": "Bad Request", 
     "headers": { 
     "_headers": { 
      "x-powered-by": [ 
      "Express" 
      ], 
      "access-control-allow-origin": [ 
      "*" 
      ], 
      "content-type": [ 
      "application/json" 
      ], 
      "date": [ 
      "Wed, 22 Mar 2017 05:36:21 GMT" 
      ], 
      "connection": [ 
      "close" 
      ], 
      "transfer-encoding": [ 
      "chunked" 
      ] 
     } 
     }, 
     "ok": false, 
     "body": { 
     "_readableState": { 
      "objectMode": false, 
      "highWaterMark": 16384, 
      "buffer": { 
      "head": { 
       "data": { 
       "type": "Buffer", 
       "data": [ 
        123, 
        34, 
        101, 
        114, 
        114, 
        111, 
        114, 
        115, 
        34, 
        58, 
        91, 
        123, 
        34, 
        109, 
        101, 
        115, 
        115, 
        97, 
        103, 
        101, 
        34, 
        58, 
        34, 
        67, 
        97, 
        110, 
        110, 
        111, 
        116, 
        32, 
        113, 
        117, 
        101, 
        114, 
        121, 
        32, 
        102, 
        105, 
        101, 
        108, 
        100, 
        32, 
        92, 
        34, 
        116, 
        111, 
        107, 
        101, 
        110, 
        92, 
        34, 
        32, 
        111, 
        110, 
        32, 
        116, 
        121, 
        112, 
        101, 
        32, 
        92, 
        34, 
        85, 
        115, 
        101, 
        114, 
        83, 
        101, 
        114, 
        118, 
        105, 
        99, 
        101, 
        115, 
        92, 
        34, 
        46, 
        34, 
        44, 
        34, 
        108, 
        111, 
        99, 
        97, 
        116, 
        105, 
        111, 
        110, 
        115, 
        34, 
        58, 
        91, 
        123, 
        34, 
        108, 
        105, 
        110, 
        101, 
        34, 
        58, 
        57, 
        44, 
        34, 
        99, 
        111, 
        108, 
        117, 
        109, 
        110, 
        34, 
        58, 
        55, 
        125, 
        93, 
        125, 
        93, 
        125 
       ] 
       }, 
       "next": null 
      }, 
      "tail": { 
       "data": { 
       "type": "Buffer", 
       "data": [ 
        123, 
        34, 
        101, 
        114, 
        114, 
        111, 
        114, 
        115, 
        34, 
        58, 
        91, 
        123, 
        34, 
        109, 
        101, 
        115, 
        115, 
        97, 
        103, 
        101, 
        34, 
        58, 
        34, 
        67, 
        97, 
        110, 
        110, 
        111, 
        116, 
        32, 
        113, 
        117, 
        101, 
        114, 
        121, 
        32, 
        102, 
        105, 
        101, 
        108, 
        100, 
        32, 
        92, 
        34, 
        116, 
        111, 
        107, 
        101, 
        110, 
        92, 
        34, 
        32, 
        111, 
        110, 
        32, 
        116, 
        121, 
        112, 
        101, 
        32, 
        92, 
        34, 
        85, 
        115, 
        101, 
        114, 
        83, 
        101, 
        114, 
        118, 
        105, 
        99, 
        101, 
        115, 
        92, 
        34, 
        46, 
        34, 
        44, 
        34, 
        108, 
        111, 
        99, 
        97, 
        116, 
        105, 
        111, 
        110, 
        115, 
        34, 
        58, 
        91, 
        123, 
        34, 
        108, 
        105, 
        110, 
        101, 
        34, 
        58, 
        57, 
        44, 
        34, 
        99, 
        111, 
        108, 
        117, 
        109, 
        110, 
        34, 
        58, 
        55, 
        125, 
        93, 
        125, 
        93, 
        125 
       ] 
       }, 
       "next": null 
      }, 
      "length": 1 
      }, 
      "length": 117, 
      "pipes": null, 
      "pipesCount": 0, 
      "flowing": null, 
      "ended": false, 
      "endEmitted": false, 
      "reading": true, 
      "sync": false, 
      "needReadable": true, 
      "emittedReadable": true, 
      "readableListening": false, 
      "resumeScheduled": false, 
      "defaultEncoding": "utf8", 
      "ranOut": false, 
      "awaitDrain": 0, 
      "readingMore": false, 
      "decoder": null, 
      "encoding": null 
     }, 
     "readable": true, 
     "domain": null, 
     "_events": {}, 
     "_eventsCount": 7, 
     "_writableState": { 
      "objectMode": false, 
      "highWaterMark": 16384, 
      "needDrain": false, 
      "ending": false, 
      "ended": false, 
      "finished": false, 
      "decodeStrings": true, 
      "defaultEncoding": "utf8", 
      "length": 0, 
      "writing": false, 
      "corked": 0, 
      "sync": false, 
      "bufferProcessing": false, 
      "writecb": null, 
      "writelen": 0, 
      "bufferedRequest": null, 
      "lastBufferedRequest": null, 
      "pendingcb": 0, 
      "prefinished": false, 
      "errorEmitted": false, 
      "bufferedRequestCount": 0, 
      "corkedRequestsFree": { 
      "next": null, 
      "entry": null 
      } 
     }, 
     "writable": true, 
     "allowHalfOpen": true, 
     "_transformState": { 
      "needTransform": true, 
      "transforming": false, 
      "writecb": null, 
      "writechunk": null, 
      "writeencoding": "buffer" 
     } 
     }, 
     "bodyUsed": false, 
     "size": 0, 
     "timeout": 0, 
     "_raw": [], 
     "_abort": false 
    } 
    }, 
    "message": "Network error: Network request failed with status 400 - \"Bad Request\"" 
} 
Error 
    at new ApolloError (/Users/rkstar/dev/projects/crate/microservices/dashboard/node_modules/apollo-client/apollo.umd.js:1490:23) 
    at /Users/rkstar/dev/projects/crate/microservices/dashboard/node_modules/apollo-client/apollo.umd.js:2149:24 
    at process._tickCallback (internal/process/next_tick.js:103:7) 

**** ****更新我 我apolloMiddleware前加入中間件CONSOLE.LOG的req.headers和req.body

req.headers ------- 
{ 
    "accept": "*/*", 
    "content-type": "application/json", 
    "authorization": "JWT ", 
    "accept-encoding": "gzip,deflate", 
    "user-agent": "node-fetch/1.0 (+https://github.com/bitinn/node-fetch)", 
    "connection": "close", 
    "content-length": "585", 
    "host": "localhost:9000" 
} 

req.body ------- 
{ 
    "query": "mutation updateTwitterAccessToken($data: TokenInput!) {\n updateTwitterToken(data: $data) {\n _id\n services {\n  twitter {\n  id\n  __typename\n  }\n  token {\n  token\n  expires\n  __typename\n  }\n  __typename\n }\n __typename\n }\n}\n", 
    "variables": { 
    "data": { 
     "accessToken": "000700000-xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx", 
     "accessTokenSecret": "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx", 
     "_id": "yyyyyyyyyyyyyyyyy", 
     "service": "twitter", 
     "serviceId": "000700000" 
    } 
    }, 
    "operationName": "updateTwitterAccessToken" 
} 

我打電話給client.mutate({ ... })從我的網絡服務器,但在req.body這裏,我設置這個:

req.body ------- 
{ 
    "query": "mutation ..." 
.... 
} 

爲什麼它是"query": "mutation ..."而不是"mutation": "mutation ..."

回答

1

TL; DR

我解決了這個問題,這是因爲我update-token.graphql文件有回報性質不當嵌套===錯誤。


OKAY ...所以我解決了這個問題。這在我的graphql變種中是一個愚蠢的錯誤。我試圖得到一個在另一個領域內不存在的領域。

我已經將我的查詢複製並粘貼到graphiql中,它工作正常!我忘記的是,我沒有嵌入我的一個回報變數,這使得所有的變化都變得非常重要。我以爲我已將我的更改粘貼回.graphql文件中......但顯然不是。

有趣的關於這是多麼我終於想通了這個錯誤:

我嘗試添加中間件打印出我的要求-------

router.all('/private', 
    bodyParser.json(), 
    (req, res, next)=>{ 
    console.log(JSON.stringify(req.route, null, 2)) 
    next() 
    }, 
    apolloMiddleware 
) 

這給我很多東西,但是當比較來自graphiql的請求vs.阿波羅的客戶端(可能是因爲實際的查詢是一個字符串,而不是格式化喜歡漂亮的JSON)

後來我終於臨到formatError這讓我能夠有打印出我的錯誤:

const apolloMiddleware: any = graphqlExpress(request => ({ 
    debug: debugMode, 
    schema: executableSchema, 
    context: request, 
    formatError: e =>{ 
    console.log(JSON.stringify(e, null, 2)) 
    } 
})) 

和顯示我:

{ 
    "message": "Cannot query field \"token\" on type \"UserServices\".", 
    "locations": [ 
    { 
     "line": 9, 
     "column": 7 
    } 
    ] 
} 

看到這個消息後,我及時更新我的​​.graphql文件,並做了一個史詩般的捂臉當我看到突變工作通過阿波羅客戶預期。