Is there any way to upload files via postman into a GraphQL API?

user_12069343 0
Viewed 15212

Currently I'm using Altair to upload files (in my case it's just for images) to my GraphQL API. However, all my other routes are stored in postman and it'd be nice if I could use just one application - Postman - for everything.

In Altair I can simply select an image and store that as a variable that I put as the value for my GraphQL Upload field.

Does anyone know if Postman supports that (or a similiar) feature?

Thank you!

graphql postman upload file
6 Answers

You can use Form-Data to do this.

Key: Operations (this is for the query / mutation )

{"query":"mutation updateAvatar($avatar:Upload!) {\n  updateAvatar(avatar: $avatar)\n}"}

Key: map ( this is to map the files to your query / mutation )

{"0": ["variables.avatar"]}

Key: 0 ( upload your image/file etc )

postman

user_106993270

The above solution didn't work for me but helped as a base.

I've inspected other GraphQL server requests in my browser and tried emulating them.

This is how it works for me:

Postman screenshot

My server runs Django with Graphene, the difference may be there (?) I guess

user_9233230

Answer from @Brad Larson is correct. But contains a typo:

You should have {"0":["variables.file"]} instead of "[variables.file]"

(Sorry I don't have enough reputation to comment)

user_29065050

I ran into this issue using graphene-file-upload==1.2.2 as the upload handler and found it extremely complex to prepare the correct payload as the request included additional parameters to the upload file, so I hope this helps:enter image description here

This is the curl equivalent request for reference:

curl --location --request POST '<REDACTED>/graphql' \
--header 'Authorization: Bearer <REDACTED>' \
--form '0=@"/home/user/Downloads/Five.pdf"' \
--form 'map="{\"0\": [\"variables.data.attachments\"]}"' \
--form 'operations="{
    \"query\": \"mutation AddPOAttachments($data: AddProductAttachmentsInput!) { add_product_attachments(data: $data) { attachments { id url purpose file_info { name type size_in_bytes} __typename } __typename }}\",
    \"variables\":
    {
        \"data\":
        {
            \"sku\": \"123456sku\",
            \"attachments\": null,
            \"purpose\": \"Test\"
        }
    }
}"'
user_3382250

Postman was unable to do this, but I found another one called Altair. See this blog that describes how to use it for file uploads. You can even see a glimpse of how it is done in the screenshot below:

screenshot Image taken from https://altairgraphql.dev/

user_20896750

you can use form-data for the same

enter image description here

you have add the below line to your graphql schema file

scalar Upload

type Mutation {
uploadFloorMap(floorMapImage: Upload!) : String
}

please add the below maven dependecies and modify your code to add new configuration

    <dependency>
        <groupId>com.graphql-java-kickstart</groupId>
        <artifactId>graphql-java-servlet</artifactId>
        <version>14.0.0</version>
    </dependency>
    <!-- https://mvnrepository.com/artifact/com.graphql-java/graphql-java-extended-scalars -->
    <dependency>
        <groupId>com.graphql-java</groupId>
        <artifactId>graphql-java-extended-scalars</artifactId>
    </dependency>

add configuration code

import graphql.kickstart.servlet.apollo.ApolloScalars;
import graphql.schema.GraphQLScalarType;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;

@Configuration
public class GraphQLConfiguration {

@Bean
public GraphQLScalarType uploadScalarDefine() {
return ApolloScalars.Upload;
 }
}
user_23351810
Related