[NOT SOLVED] Image resource not being generated (sometimes)

support
1

Got a problem with image resources.Get

UPDATE:

I already identified the issue.
If I use resources.Get to in one of the images from a post, it will return a 404 for the rest of the site.

The post processed version will work, yes, but the original version of the image will return a 404.

Can this be a bug?

I’m using the following code to display some of my images in a specific template post (editorial).

The problem is that, somehow, the images in other template posts (d&d, etc) sometimes show, sometimes they simply won’t. I’m not sure where the problem is to be honest, because it kinda looks like it is okay.

If I completely erase the following code from the site, then the images in the posts work. But if I keep this code, the behaviour returns.

This is in my editorial template: (the suspect)

{{ if .Params.article_img }}

{{ if eq .Params.style "regular-comic" }}
    {{ $base := print .Section "/img" }}
    {{ $path := print .Params.article_img }}
    {{ $url := print $base "/" $path "-en-xs.jpg" }}
    {{ $image := resources.Get $url }}                                 
    {{ with $image }}
    {{ $scaled := .Fill "900x420" }}
        <div class="articles_img_box">
            <img src="{{ $scaled.Permalink }}" class="img-liquid">
        </div>
    {{ end }}
{{ else if eq .Params.style "regular-full-split-square" }}
    {{ $base := print .Section "/img" }}
    {{ $path := print .Params.article_img }}
    {{ $url := print $base "/" $path "-md.png" }}
    {{ $image := resources.Get $url }}                                    
    {{ with $image }}
    {{ $scaled := .Fill "600x420" }}
    <div class="articles_img_box">
        <img src="{{ $scaled.Permalink }}" class="img-liquid">
    </div>
    {{ end }}
{{ else }}
    {{ $base := print .Section "/img" }}
    {{ $path := print .Params.article_img }}
    {{ $url := print $base "/" $path "-xs.jpg" }}
    {{ $image := resources.Get $url }}    
    {{ with $image }}
        {{ $scaled := .Fill "600x320" }}
        <div class="articles_img_box">
            <img src="{{ $scaled.Permalink }}" class="img-liquid">
        </div>
    {{ end }}
{{ end }}                                    
{{ else }}
<div class="articles_img_box" id="editorial_letter">
    <img src="{{ .Site.BaseURL }}img/thefreebundle-{{ .Site.Language }}_tw_fb_card.jpg" class="img-liquid">
</div>
{{ end }}

And this goes in my other templates, where the bug happens:

{{ $base := print .Section "/img" }}

{{ $path := print .Params.article_img }}

{{ $url_xs := print $base "/" $path "-xs.png" }}

{{ $url_md := print $base "/" $path "-md.png" }}

{{ $image_xs := resources.Get $url_xs }}

{{ $image_md := resources.Get $url_md }}

Now, this should show the image path:

{{ $image_md.Permalink }}

Which it actually does, but the liveroad doesn’t shows the image. It says 404 not found (although the path is absolutely right and the image should be there)

In fact, the image that “shows up” is blank and its a 24x24 pixel image (!?!?!??!)

24px × 24px (scaled to 1,115px × 0px)

But if I fingerprint the image, it obviously shows. Maybe it has something to do with browser cache? (though I’m clearing the cache and trying different browsers and the problem keeps happening unless I use fingerprint)

I’m lost here!

EDIT and UPDATE
Found another person having a similar issue in the forum. It appears the problem is I was trying to handle a PNG image. Sometimes it works, others it doesn’t. The person had the same issue, PNG -> .Fill

I switched to jpg and it worked fine for a while, then it went back on doing it again! =(

2

I have not studied your example in detail, but resources fetched via resources.Get will not be published unless either .Permalink or .RelPermalink is accessed.

3

I’m using .Permalink on the fetched images. The resulting images url are okay, but they don’t show (404) even though the images are being processed (and the images ARE actually there).

4

What I mean is, every time I use resources.Get and then I use “.Fill”, I can’t use that image again on the site. I have to use the image that’s a result of .Fill, not the original one (it returns a 404). In fact, if I use any post-process method on the images, then I can’t use the original one.

UPDATE

Found it. I was saving under img instead of images. Turns out it doesn’t finds the ORIGINAL image after one does a post-process (.Fill, .Resize, .Fit, anything) if the images are under a different folder in assets other than img.

That means that you have

A.jpg

You run a post-process and you get

A_r90sa849ilkdgdfds.jpg (the post-processed image)
A.jpg (original, doesn’t displays unless it is in a /images/ folder. Any other folder in assets will be ignored)

I would leave this thread here in case someone else runs into this issue.

I’ll have my payment in doritos, please.

5

Just a heads up, the issue keeps happening randomly. There may be a bug with the server ;(

It fixes itself by shutting the server off, then on again several times and making changes until it “refreshes” the cache.

6

Try running the below, which will perform garbage collection

hugo server --gc
1 Like
7

That hit the spot man, thank you!

The problem persists. Its driving me crazy. It goes on and off each time I fire the server. If I do:

{{ if eq .Params.style "regular-comic" }}
    {{ $base := print .Section "/images" }}
    {{ $path := print .Params.article_img }}
    {{ $url := print $base "/" $path "-en-md.jpg" }}
    {{ $image := resources.Get $url }}                                 
    {{ with $image }}
    {{ $scaled := $image.Fill "700x600 center" }}
        <div class="articles_img_box">
            <img src="{{ $scaled.Permalink }}" class="img-liquid">
        </div>
    {{ end }}
{{end }}

if I use $scaled.Permalink it appears to work for a moment, but then the error happens and I have to use simply .Permalink and reset the server. I have to do this every couple of minutes when the images return 404.

Using --gc initially appeared to work, but it didn’t.

8

Please share access to a complete site project that reproduces the issue. More folks will be able to help if they can generate the site locally. :slight_smile:

9

cannot do, sorry ;(

I found that using --ignoreCache solved the problem. zwbetz pointed out the garbage collection, which made me think about cache.

There is a bug somewhere with the image post-processor and the cache. Hopefully someone will find a way to solve it somewhere down the line when more people come across the same issue I have.

Cheers!

10

To clarify: you can not reproduce this issue in a separate project?