Wrong image url in image and gellery field type


When I upload image and add this to image field by ‘Select Image’ in image url I get only file name with extention e.g. image.jpg .

When I add image by ‘Select Asset’ in image url I get full url for image but starting from cockpit directory e.g. /cockpit/storage/uploads/2019/10/24/image.jpg .

It causes a problem when I working with @fika/gatsby-source-cockpit plugin and want to use image with gatsby-transformer-sharp plugin because the value attribute for image filed in graphql query is invisible when the image url is incorrect. When i set image url by ‘Enter Image Url’ to /storage/uploads/2019/10/24/image.jpg everyting works great and value attribute with publicPath and childImageSharp and others attributes appears in graphql query and it works, image loads with lazy loading and blur effect.

But when i set image url to /storage/uploads/2019/10/24/image.jpg image preview diasppears in cockpit panel.

This same problem is with gallery field type but in this case I cant set image url by ‘Enter Image Url’ because this option in unavailable in gallery field.

Think that issue is relevant as the gallery image paths should be consistent with the asset field (saving exactly the same path and not including the storage/uploads prefix).
Also if using CloudStorage add-on it will save the full url instead of the /storage/uploads/... path.

@artur to avoid retro-compatibility issues would be good if the gallery accepts a setting to not set the path prefix and therefore save the path without the storage/uploads. Not sure if that make sense but probably you can enlighten us.

@ds-codemag, please keep the community posted about the fika gatsby plugin and your findings (maybe a good idea to have a room in the discord cockpit channel). I checked it recently but didn’t had the time to investigate further. Also regarding the gatsby transformer plugin, my experience in the past is that doesnt scale properly, if you have a massive number of images the builds will take a long time.

@ds-codemag Is this issue perhaps related?
I’m successfully using @fika/gatsby-source-cockpit plugin with Gatsby, and the only difference in our setups, that I can think of, is that my cockpit is not inside subfolder (e.g. it’s:
url.com/ vs. url.com/cockpit).

Ok. I’ll try this today. Maybe this is the problem. I will be very happy if this will be working because cockpit is ideally cms for website which i’m building but I couldnt use it with this problem. Thaks for your reply! I’ll give a feedback if working.

@Blistok your solution works perfect! Thank you so much for help!

1 Like