Best work around to upload images via GraphQl?

Anonymous
Not applicable

Hi

 

I want to upload images via url and I used the api productImageAppend for it. 

But getting following error:

 

[ { line: 1, column: 30 } ]
[ { path: [], explanation: 'Expected value to not be null' } ]
{
  errors: [
    {
      message: 'Variable $input of type ProductAppendImagesInput! was provided invalid value',
      locations: [Array],
      extensions: [Object]
    }
  ]
}

 

What is wrong with my input?

 

Passed data:

{
  id: 'Z2lkOi8vc2hvcGlmeS9Qcm9kdWN0LzYxNjY4OTIwMTk4ODI=',
  images: [
    {
      id: 'gid://shopify/ProductImage/23275841716394',
      src: 'https://75b4f01e4a04.ngrok.io/aintelligence/current/6166892019882/6166892019882_23275841716394.jpg'
    },
    {
      id: 'gid://shopify/ProductImage/23275841749162',
      src: 'https://75b4f01e4a04.ngrok.io/aintelligence/current/6166892019882/6166892019882_23275841749162.jpg'
    }
  ]
}

GraphQl

const APPEND_IMAGES = `mutation productAppendImages($input: ProductAppendImagesInput!) {
  productAppendImages(input: $input) {
    newImages {
       id
    }
    product {
      id
    }
    userErrors {
      field
      message
    }
  }
}
`

 

Function appendImages

async function appendImages(queryName, variables, token) {
  try {
    const res = await axios({
      headers: {
        'X-Shopify-Access-Token': token,
      },
      method: 'post',
      data: {
        query: queryName,
        variables: variables,
      },
      url: url,
    });
    if (res) {
      console.log(res.data.errors[0].locations)
      console.log(res.data.errors[0].extensions.problems)
      console.log(res.data)
      return res;
    }
  } catch (err) {
    console.log(err.message);
  }
}

 

Replies 2 (2)
c10s
Shopify Partner
65 12 13

I think you need to make the product id in ProductAppendImagesInput! a gid as well, eg: gid://shopify/Product/10079785100

davidhollenbeck
Shopify Partner
12 0 1

I'm sure OP has found this already but just posting here for anyone else that runs into this issue. It seems including both an id and image src results in an error saying you need to either provide image gid or image src.

 

I tried just using the image gid and no src or altText, however when I did this I got an error saying I needed to provide an image src. So I tried it with src + altText and it works.

 

Also, C10s correct, the id in the input should be a gid.