GET Inventory_item_id blocked by CORS

DopicoPeña
Visitor
2 0 0

I have the following fetch to get inventory items as described here

const inventoryItems = new Promise(resolve => {
	const requestUrl = `/admin/api/2020-07/inventory_items.json?ids=${variant.id}`

	const request = new XMLHttpRequest();
	request.open('GET', requestUrl);
	request.onload = ({ srcElement: { status, response } }) => {
		if (status >= 200 && status < 300) {
			resolve(JSON.parse(response))
		} else {
			console.log('error: ', error)
		}
	}
	request.send();
})
inventoryItems.then(data => {
	console.log('inventoryItems: ', data)
})

 

This fetch results in the following error:
Schermafbeelding 2020-08-25 om 14.19.28.png

Does anyone know how to resolve this issue?

Thanks

Replies 3 (3)

Gregarican
Shopify Partner
1033 86 285

The Admin API is meant to be used by private apps, meaning any client-side code that is public facing would present a security risk. Hence the CORS error you are seeing. Please check out this thread for a more detailed explanation --> https://community.shopify.com/c/Shopify-APIs-SDKs/Using-APIs-from-a-different-origin-domain/td-p/502...

Hope this helps!

DopicoPeña
Visitor
2 0 0

Hi Greg, thanks for your reply - 
So how would I be able to get the inventory_item_id then? Is this possible to get with a simple fetch? 

Gregarican
Shopify Partner
1033 86 285

You would need to build out a private app (assuming private, if this is just an integration for a single Shopify shop), hosted somewhere aside from the Shopify shop.

Your Shopify shop can make a client call to the private app, your private app fetches the required data, and then the response is passed back to the client call. Since your private app still needs to be secured, so that the Internet at-large just can't hit your shop data, the easiest way to implement this might be via an app proxy. Here are some details --> https://shopify.dev/tutorials/display-data-on-an-online-store-with-an-application-proxy-app-extensio....