skip to Main Content

Summary

I have been following the Shopify tutorial on setting up an App using Node and React. I have everything working but I am trying to move past the last step. I am trying to get the data returned from the Shopify webhooks and I can’t see where the data/payload is.

Background

I’ve tried printing out the response and request both before and after the middleware but didn’t seem to get anything useful back, just recieved things like the following:

{ method: 'POST',
  url: '/webhooks/products/create',
  header:
   { host: '01e9702c.ngrok.io',
     'user-agent': 'Shopify-Captain-Hook',
     'content-length': '1175',
     accept: '*/*',
     'accept-encoding': 'gzip;q=1.0,deflate;q=0.6,identity;q=0.3',
     'content-type': 'application/json',
     'x-shopify-api-version': '2019-07',
     'x-shopify-hmac-sha256': 'some value',
     'x-shopify-product-id': '2018829729858',
     'x-shopify-shop-domain': 'example.myshopify.com',
     'x-shopify-topic': 'products/create',
     connection: 'close',
     'x-forwarded-proto': 'https',
     'x-forwarded-for': '123.456.789' } }

  router.post('/webhooks/products/create', webhook, (ctx) => {
    console.log('Products webhook - create: ', ctx.state.webhook);
    // Want to view product that was created here
  });

  router.post('/webhooks/products/delete', webhook, (ctx, x) => {
    console.log('Products webhook - delete: ', ctx.state.webhook);
    // Want to see product that was deleted here
  });

Expected Output

I would expect to receive a json object as described in the Shopify Webhook event docs. e.g.

{
  "id": 788032119674292922,
  "title": "Example T-Shirt",
  "body_html": null,
  "vendor": "Acme",
  "product_type": "Shirts",
  "created_at": null,
  "handle": "example-t-shirt",
  "updated_at": null,
  "published_at": "2019-08-08T16:16:49-04:00",
  "template_suffix": null,
  "tags": "mens t-shirt example",
  "published_scope": "web",
  "variants": [
    {
      "id": 642667041472713922,
      "product_id": 788032119674292922,
      "title": "",
      "price": "19.99",
      "sku": "example-shirt-s",
      "position": 0,
      "inventory_policy": "deny",
      "compare_at_price": "24.99",
      "fulfillment_service": "manual",
      "inventory_management": "shopify",
      "option1": "Small",
      "option2": null,
      "option3": null,
      "created_at": null,
      "updated_at": null,
      "taxable": true,
      "barcode": null,
      "grams": 200,
      "image_id": null,
      "weight": 200.0,
      "weight_unit": "g",
      "inventory_item_id": null,
      "inventory_quantity": 75,
      "old_inventory_quantity": 75,
      "requires_shipping": true
    },
    {
      "id": 757650484644203962,
      "product_id": 788032119674292922,
      "title": "",
      "price": "19.99",
      "sku": "example-shirt-m",
      "position": 0,
      "inventory_policy": "deny",
      "compare_at_price": "24.99",
      "fulfillment_service": "manual",
      "inventory_management": "shopify",
      "option1": "Medium",
      "option2": null,
      "option3": null,
      "created_at": null,
      "updated_at": null,
      "taxable": true,
      "barcode": null,
      "grams": 200,
      "image_id": null,
      "weight": 200.0,
      "weight_unit": "g",
      "inventory_item_id": null,
      "inventory_quantity": 50,
      "old_inventory_quantity": 50,
      "requires_shipping": true
    }
  ],
  "options": [
    {
      "id": 527050010214937811,
      "product_id": 788032119674292922,
      "name": "Title",
      "position": 1,
      "values": [
        "Small",
        "Medium"
      ]
    }
  ],
  "images": [
    {
      "id": 539438707724640965,
      "product_id": 788032119674292922,
      "position": 0,
      "created_at": null,
      "updated_at": null,
      "alt": null,
      "width": 323,
      "height": 434,
      "src": "//cdn.shopify.com/s/assets/shopify_shirt-39bb555874ecaeed0a1170417d58bbcf792f7ceb56acfe758384f788710ba635.png",
      "variant_ids": [
      ]
    }
  ],
  "image": null
}

2

Answers


  1. What is the web framework you are using? Is it Express? Adding the code for webhook would help but right now your signatures are off.

    See my answer here Nodejs – Expressjs – Verify shopify webhook for how to use the verify method of body parser.

    Then your hook handler would look like:

    router.post('/webhooks/products/create', (req, res)=>{
        console.log(JSON.stringify(req.body, null, ' '));
        res.sendStatus(200);
        // process the webhook
    });
    
    Login or Signup to reply.
  2. It looks like you are using the Koa framework from the basic node/react example.

    Assuming you have already found it, but anyone looking, the answer is ctx.state.webhook.payload
    You can acces the individual elements from there so
    ctx.state.webhook.payload.title etc also work.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search