Axios, Storefront API, Parameter missing or invalid

Solved

Axios, Storefront API, Parameter missing or invalid

jackgeorge11
Tourist
4 2 0

I've spent hours on this, someone please help. Trying to retrieve metafields from the Shopify storefront API with axios. Metafields are exposed. The post request works in Postman just fine. See image below.

Screen Shot 2021-09-05 at 10.16.40 AM.png

I have literally copied Postman's axios code verbatim and, and it returns a 404 error every time. I have tried lots of different things but to no avail. Can someone please tell me what I'm doing wrong? Here is my code: 

      var data = JSON.stringify({
        query: `query {     
        products(first:10) {         
          edges {             
            node {                 
              id                 
              handle                 
              metafields(first:10){                     
                edges {                         
                  node {                             
                    key                             
                    value                         
                  }                     
                }                 
              }             
            }         
          }     
        }
      }`,
        variables: {}
      });

      var config = {
        method: 'post',
        url: 'https://<shop-name>.myshopify.com/api/2021-07/graphql.json',
        headers: { 
          'X-Shopify-Storefront-Access-Token': '<access token>', 
          'Content-Type': 'application/json'
        },
        data : data
      };

      axios(config)
      .then(function (response) {
        console.log(JSON.stringify(response.data));
      })
      .catch(function (error) {
        console.log(error.response);
      });

 

Here is the error:

 

Screen Shot 2021-09-05 at 12.28.50 PM.png

Accepted Solution (1)
jackgeorge11
Tourist
4 2 0

This is an accepted solution.

This is my issue haha. You think this code would work splendidly, but it returns a 400 status error...

 

I figured it out and for whatever reason, this code works properly:

 

await axios.post(
        'https://<store name>.myshopify.com/api/2021-07/graphql.json',
        {query: `
            query {     
              products(first:10) {         
                edges {             
                  node {                 
                    id                 
                    handle                 
                    metafields(first:10){                     
                      edges {                         
                        node {                             
                          key                             
                          value                         
                        }                     
                      }                 
                    }             
                  }         
                }     
              }
            }
        `},
        {headers: {'X-Shopify-Storefront-Access-Token': '<token>', 'Content-Type': 'application/json'}}
      )

View solution in original post

Replies 2 (2)

Vellir
Shopify Partner
146 32 40

Hi jackgeorge11,

Is it necessary to encode the data?

May you can just do this:

var config = {
  method: "post",
  url: "https://<shop-name>.myshopify.com/api/2021-07/graphql.json",
  headers: {
    "X-Shopify-Storefront-Access-Token": "<access token>",
    "Content-Type": "application/json",
  },
  data: {
    query: `query {     
        products(first:10) {         
          edges {             
            node {                 
              id                 
              handle                 
              metafields(first:10){                     
                edges {                         
                  node {                             
                    key                             
                    value                         
                  }                     
                }                 
              }             
            }         
          }     
        }
      }`,
  },
};

axios(config)
  .then(function (response) {
    console.log(JSON.stringify(response.data));
  })
  .catch(function (error) {
    console.log(error.response);
  });

 

Let me know how that goes.

- Looking for a Wishlist? Try First Wish

- Shopify Merchants, manage your new arrivals with Newr

- Shopify Developers, if you're looking into selling your app to focus on other projects, drop me a line.
jackgeorge11
Tourist
4 2 0

This is an accepted solution.

This is my issue haha. You think this code would work splendidly, but it returns a 400 status error...

 

I figured it out and for whatever reason, this code works properly:

 

await axios.post(
        'https://<store name>.myshopify.com/api/2021-07/graphql.json',
        {query: `
            query {     
              products(first:10) {         
                edges {             
                  node {                 
                    id                 
                    handle                 
                    metafields(first:10){                     
                      edges {                         
                        node {                             
                          key                             
                          value                         
                        }                     
                      }                 
                    }             
                  }         
                }     
              }
            }
        `},
        {headers: {'X-Shopify-Storefront-Access-Token': '<token>', 'Content-Type': 'application/json'}}
      )