Create Product with raw jpeg Images using graphiQL

[superstoredev]

Hi,

I am trying to create/update product using graphiQl api, and as part of the product need to upload Jpeg Product images. I am using productCreate and productUpdate mutant, but both use ImageInput which only take image url.

How can I attach 64 base image as part of product create  like it can be done using rest api?

{
"altText": "",
"id": "",
"src": ""
}

Thanks in advance.

[ShopifyDevSup · Accepted solution]

Hi @superstoredev 👋

To create media for the products using the `productCreate` mutation , the payload will need to include the `media` argument of the type `CreateMediaInput`. If the image needs to be uploaded, you can use the `stagedUploadsCreate` mutation and provide the staged upload URL as the `CreateMediaInput.originalSource` field. This guide highlight each step of the process, and the `productCreate` mutation would result in something similar to the below:

mutation productCreate($input: ProductInput!, $media:[CreateMediaInput!]) {
    productCreate(input: $input, media: $media) {
        product {
            id
            media (first:3)
                nodes {
                    ... on MediaImage {
                        id
                        image {
                            url
                        }
                    }
                }
            }
        }
    }
}

With variables: 

{
  "input": {
    "title": "new product"
  },
  "media": {
    "alt": "test",
    "mediaContentType": "IMAGE",
    "originalSource": "https://shopify-staged-uploads.storage.googleapis.com/tmp/1234/products/7c03w39e5-81fa0-44841-8s76e-12fe5eg33026e/shopify.jpg"
  }
}

Hope that helps!

[superstoredev]

This is a common problem, considering this has 4 steps process, may be a single page wiki will be useful.

Rest API allows you to create products with images ( raw or URL)in a single step.