utterances-bot commented 3 years ago

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 commented 3 years ago

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 commented 3 years ago

Awesome! Glad it helped.

muco-rolle commented 3 years ago

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 commented 3 years ago

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 commented 3 years ago

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 commented 3 years ago

@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 commented 3 years ago

Thanks for sharing!

Justas-Kaulakis commented 3 years ago

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 commented 3 years ago

@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 commented 2 years ago

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 commented 2 years ago

@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 commented 2 years ago

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

XKojiMedia / xkojimedia.github.io

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

Working with file uploads using Altair GraphQL · XKoji.dev