簡體   English   中英

GraphQL 文件上傳純 JS “必須提供查詢字符串。”

[英]GraphQL file upload plain JS "Must provide query string."

我正在使用普通 JS 將文件上傳到 GraphQL API。 幾個月來我一直在同一個來源做這件事,現在正試圖用 NodeJS 在外部實現完全相同的東西。

我的代碼看起來像這樣:

const FormData = require('form-data');
const fs = require('fs')
const axios = require('axios')

const payload = generateRequest(input)

axios.post(apiBaseUrl + "/graphql", payload, {
      headers: {...payload.getHeaders()}
    }).then(response => {
        let res = response.data
        if (res.data.triggerPcWorkflow.status === 200) {
            console.log("success!")
        } else {
            console.error(res.data.triggerPcWorkflow.message)
        }
      })
      .catch(err => {
          if (err.response) {
              console.log(err.response.data);
              console.log(err.response.status);
              console.log(err.response.headers);
          }
      })

使用generateRequest function 生成多部分有效負載( https://github.com/jaydenseric/graphql-multipart-request-spec )。

我在localhost:5000mycooldomain.com上運行了兩個相同版本的后端。 apiBaseUrl設置為http://localhost:5000時,一切正常。 但是,只需將 URL 更改為https://www.mycooldmain.com我收到 400 錯誤, { errors: [ { message: 'Must provide query string.' } ] } { errors: [ { message: 'Must provide query string.' } ] }

順便說一句:一個簡單的query適用於兩個 URL...

這是我的generateRequest function:

const mutation = `
mutation MyMutation($xyz: String) {
    doSomething(myInput: $xyz) {
        status 
        message
    }
}
`

let sendData = new FormData();
const fileNull = [];
    
// map
files = generateRequestInput.files
let map = '{'

for (let i = 0; i < files.length; i++) {
  fileNull.push(null);
  map += `"${i}": ["variables.files.${i}"], `
}

map = map.substring(0, map.length-2);
map += '}'

// operations
const operations = JSON.stringify({
    query: mutation,
    variables: {
        "xyz": "Hello"
    }
  });

// build payload
sendData.append("operations", operations)
sendData.append("map", map)
for (let i = 0; i < files.length; i++) {
    sendData.append(i, files[i]);
}

return sendData

我知道map看起來有點丑,但這不是重點(除非是)。

有沒有人遇到過類似的問題或知道我的錯誤是什么? 謝謝!

我跳過了axios依賴項並直接使用FormData實現了請求。

下面的代碼有效。

function makeRequest(formData, options) {
  formData.submit(options, (err, res) => {
    if (err) {
      console.error(err.message)
      return
    } else {
      
      if (res.statusCode < 200 || res.statusCode > 299) {
        console.error(`HTTP status code ${res.statusCode}`)
      }
      
      const body = []
      res.on('data', (chunk) => body.push(chunk))
      res.on('end', () => {
        const resString = Buffer.concat(body).toString()
        console.log(resString)
      })
    }
  })
}

const options = {
  host: 'mycooldomain.com',
  port: 443,
  path: '/graphql',
  method: 'POST',
  protocol: 'https:'
}

makeRequest(payload, options)

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM