I am managing to create a page that calls products API from Spree. I use Spree API for my e-commerce solution, which is built into their framework and is setup automatically. The front end uses ReactJS via react-rails gem.
I can't find the URL for the images in the Spree V2 API products link. It isn't mentioned in the docs and in the API JSON source. I only see the type and ID in the API response.
My repository: https://github.com/salman15/stern_spree_react
I tried to display the type, but this appears empty.
<p>Shop Products</p>
{this.state.products.map(product =>
<li key={product.objectID}>
<p>{product.attributes.price}</p>
<Card>
<CardActionArea>
<CardMedia
image={product.relationships.images.data.type}
title={product.attributes.name}
/>
<CardContent>
<Typography gutterBottom variant="h5" component="h2">
{product.attributes.name}
</Typography>
<Typography component="p">
Lizards are a widespread group of squamate reptiles, with over 6,000 species, ranging
across all continents except Antarctica
</Typography>
</CardContent>
</CardActionArea>
<CardActions>
<Button size="small" color="primary">
Share
</Button>
<Button size="small" color="primary">
Learn More
</Button>
</CardActions>
</Card>
</li>
)}
I got an response from the Spree Devs
you can grab images from the Products API by specifying that you want them to be returned in the response - please take a look at the
include
parameter https://guides.spreecommerce.org/api/v2/storefront#operation/Show%20Product