如何将上传文件类型转换为GraphQl uploadfile类型

Question

我尝试将图像上传到用vue.js构建的客户端中的服务器，但我一直都有错误。我尝试使用formdata发送请求，直接使用文件列表对象，用文件对象尝试。

，但没有什么可以奏效的。

我的表格

<form enctype="multipart/form-data">
  <input
    @change="uploadPhoto($event)"
    accept="image/*"
    ref="file"
    type="file"
    name="files"
    id="files"
    class="inputfile inputfile-upload"
    capture="user"
  >
</form>

我的上传功能

uploadPhoto({ target }) {
  const formData = new FormData()
  formData.append('files', target.files)
  HTTP.post('/graphql', {
    query: `
      mutation UploadFile($file: Upload!) {
        upload(file: $file) {
          id
          hash
          url
        }
      }
    `,
    variables: {
      file: formData,
    },
  })
},

显示错误：

{"errors":[{"message":"The "path" argument must be one of type string, Buffer, or URL. Received type undefined"

感谢您的帮助。

Answer 1

假设您使用的是graphql-upload(以前使用apollo-upload-server(或apollo-server(使用引擎盖下的graphql-upload(，则应使用支持GraphQl Multipart Specification的客户端。

。

如果您使用的是VUE，则最容易使用适当的链接设置Apollo。

示例用法：

const { ApolloClient } = require('apollo-client')
const { InMemoryCache } = require('apollo-cache-inmemory')
const { createUploadLink } = require('apollo-upload-client')
const client = new ApolloClient({
  cache: new InMemoryCache(),
  link: createUploadLink()
})

有关其他详细信息，请参见文档。