Live inventory on the site

I need to show available inventory from snipcart to my site.
I am using HTML crawler to crawl my products in snipcart.
I am using SnipCart JS function in order to fetch products from Snipcart.

useEffect(() => {
        getProductdata()
    }, [])    
async function getProductdata(){
        setIsLoading(true);
        const secret = `${process.env.GATSBY_SNIP_SECRET}`
        const request = await fetch(`https://app.snipcart.com/api/products/${data.productsCsv.id}`, {
            headers: {
                'Authorization': `Basic ${btoa(secret)}`,
                'Accept': 'application/json'
            },
        }).then((request => request.json()))
          .then(data => setProductData(data))
          .catch(err=>console.log(err))  
          .finally(() => setIsLoading(false))
    }

I can receive the items from this but it breaks the checkout functionality.

it give me product validation error.

Hi there,

Since calls to the products API endpoint are authenticated using a secret API key, it is strongly discouraged that you use it in your front-end code. Secret API keys give full access to your account’s data.

At the moment it is not possible to request stock levels from the frontend since lots of our customers do not want this information to be publicly disclosed.

We might introduce a setting to enable publishing it at some point though.

Don’t hesitate if you have further questions.

Cheers,

hey thanks for getting back to me on this.
I am using environment variable() so technically i’am not disclosing the secret key.

So basically idea is to show out of stock product (cross off) so use can not order an item.

If this something not available at the moment. if you suggest some alternative to achieve this would be much appreciated.

Hi there, as I am also looking for an approach to this.

I am a bit confused with the replies because the API does allow to GET the variant stocks from a specific product.

Can’t we just send a request to get the JSON file, then get the variant stocks property?

if variants.stock < 0 → disable button.

Also, Does Snipcart has Domain Validation where even if the secret key is public, any request sent with the Secret API is only allowed through that particular domain?

Hi @bow and @francis

Just want to follow up. You can use Netlify serverless function with the REST API to only return certain data, in your case is the stock number → So that your API is hidden and it doesn’t interfere with Snipcart on your site so your checkout should be fine.

I hope this will help