blog/working-with-file-uploads-using-altair-graphql/

[utterances-bot]

Working with file uploads using Altair GraphQL · XKoji.dev

It’s no news that GraphQL is still the new kid on the block and has come to stay (don’t worry REST APIs still have their place 😄). As the GraphQL community…

https://www.xkoji.dev/blog/working-with-file-uploads-using-altair-graphql/

[Oluwasetemi]

Thank you so much for writing this and creating altair. I was able to figure out the file upload to work on one of my projects.

[imolorhe]

Awesome! Glad it helped.

[muco-rolle]

Thank you creating Altair it's really awesome one of the reasons I used is because it provides way to upload files but when the window opens for choosing the in file explorer we can't see the normal file explorer interface like texts are in form of squares I'm using Manjaro distro

[imolorhe]

Hey! Sorry to hear that. You can create an issue in the repo with more details including screenshots so we can discuss it in more details 🙂 https://github.com/imolorhe/altair/issues

[wangxinru]

if I want send other formdata how can I write graphql with Altair?
mutation($file:[Upload]){
createDocument(multipartBody:$file){
documentName
fileDownloadUrl
}
}
like this only upload file

[imolorhe]

@wangxinru how do you mean other form data? Is this other form data supported in the GraphQL spec? The file upload implementation is a specific spec for file upload support. I'm not aware of any other form data related specifications.

[hongbo-miao]

Thanks for sharing!

[Justas-Kaulakis]

Great docs!
Im just not sure how to name the "file name" input if my mutation accepts an object containing the file as a parameter?

input MemberInput {
fullName: String!
description: String!
image: Upload
}

mutation CreateMember($input: MemberInput!) {
createMember(input: $input) {
id
fullName
imageId
description
createdAt
}
}

[imolorhe]

@Justas-Kaulakis you would have to split out your input object. Following the example you shared,

input MemberInput {
  fullName: String!
  description: String!
  image: Upload
}

mutation CreateMember($fullName: String!, $description: String!, $image: Upload) {
  createMember(input: {
    fullName: $fullName,
    description: $description,
    image: $image
  }) {
    id
    fullName
    imageId
    description
    createdAt
  }
}

[automi0919]

Unhandled Rejection (Error): Validation error of type VariableTypeMismatch: Variable type 'Upload' doesn't match expected type '[Upload]' @ 'createUploadCoverImage'

When I use this , I get this error

[imolorhe]

@webDeveloper-619 you're mixing the Upload type with the list form [Upload] which is used for multiple uploads. You can try using the little toggle button beside the file name to switch between single file mode Upload and multiple file mode [Upload]

[saurabhkala1990]

Can you please share how the SDL looks like in the case of file upload. I created a custom scalar type and defined that with MultipartFile and getting 422 unprocessed entity error when trying to hit from Altair