Issue loading images thumbnail

[RedAlan92]

Hi,

in the data base product list, the images thumbnail won't load.

how can I proceed ?

Regards

[supergeorg]

I have seen this behavior when using an unsupported image format (or too large image), when loading the same image twice on a different location and also randomly.

Please check if your image is a valid type (png, jpg, heic?) and if it can be shown after an app restart. AsyncImage doesn't seem to work too dependable, maybe some workaround is possible.

[RedAlan92]

Hi, I used jpg images. There is some pre requisite on the image size ?

[supergeorg]

Try a smaller resolution, either manually or by using the included photo mode (add picture via Camera or Gallery), they should be resized automatically.

[Gnoupi]

I encounter the same issue, and all the images I took from the ios app directly, without changing a thing, so I would expect them to be supported? The images do show up in the web interface and seem quite normal (jpg, 300x400)

[Gnoupi]

For the record, the issue is still present after the filename sanitization fix, so it does not seem to be related to this.

@supergeorg Is there any log or something we can check for potential errors? The regular app log does not have anything on this matter.

[krzywro]

Hi, I have the same problem. App shows infinite loading of pictures while Web UI loads them correctly. Filenames have JPG file format.

[orbsmiv]

I'm also experiencing the same issue. I've had a look at the logs on my proxy server and it seems as though the app's making unauthenticated requests for these images and as such the server is returning HTTP 401 errors.

[orbsmiv]

Further to my previous comment, here is a log entry from a failed request:

caddy_1 | 2022/10/30 22:32:51.696 ERROR http.log.access.log0 handled request {"request": {"remote_ip": "192.168.1.2", "remote_port": "62385", "proto": "HTTP/2.0", "method": "GET", "host": "my.server.com:8445", "uri": "/api/files/productpictures/MHhhOG1kM3dkc2wxeG5xdTVheHJuOWltZ18xNzQwLmpwZw==?force_serve_as=picture", "headers": {"User-Agent": ["Grocy%20Mobile/29 CFNetwork/1399 Darwin/22.1.0"], "Accept": ["*/*"], "Accept-Language": ["en-GB,en;q=0.9"], "Accept-Encoding": ["gzip, deflate, br"]}, "tls": {"resumed": false, "version": 772, "cipher_suite": 4867, "proto": "h2", "server_name": "my.server.com"}}, "user_id": "", "duration": 0.103729986, "size": 0, "status": 401, "resp_headers": {"Access-Control-Allow-Methods": ["GET, POST, PUT, DELETE, OPTIONS"], "Date": ["Sun, 30 Oct 2022 22:32:51 GMT"], "Content-Type": ["text/html; charset=UTF-8"], "Server": ["Caddy", "nginx/1.20.2"], "Alt-Svc": ["h3=\":8445\"; ma=2592000"], "Access-Control-Allow-Headers": ["*"], "X-Powered-By": ["PHP/8.0.25"], "Access-Control-Allow-Origin": ["*"]}}

... vs a successful request from the browser version of Grocy:

caddy_1 | 2022/10/29 23:26:40.902 INFO http.log.access.log0 handled request {"request": {"remote_ip": "192.168.1.2", "remote_port": "54943", "proto": "HTTP/2.0", "method": "GET", "host": "my.server.com:8445", "uri": "/api/files/productpictures/MHhhOG1kM3dkc2wxeG5xdTVheHJuOWltZ18xNzQwLmpwZw==?force_serve_as=picture", "headers": {"Accept": ["text/html,application/xhtml+xml,application/xml;q=0.9,image/avif,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.9"], "Sec-Fetch-Site": ["none"], "Accept-Language": ["en-US,en;q=0.9"], "Cookie": [], "Sec-Ch-Ua-Mobile": ["?0"], "Sec-Ch-Ua": ["\"Chromium\";v=\"106\", \"Google Chrome\";v=\"106\", \"Not;A=Brand\";v=\"99\""], "Sec-Ch-Ua-Platform": ["\"macOS\""], "Upgrade-Insecure-Requests": ["1"], "User-Agent": ["Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/106.0.0.0 Safari/537.36"], "Sec-Fetch-Mode": ["navigate"], "Sec-Fetch-User": ["?1"], "Accept-Encoding": ["gzip, deflate, br"], "Cache-Control": ["max-age=0"], "Sec-Fetch-Dest": ["document"]}, "tls": {"resumed": true, "version": 772, "cipher_suite": 4867, "proto": "h2", "server_name": " "}}, "user_id": "", "duration": 0.212610675, "size": 1015312, "status": 200, "resp_headers": {"Access-Control-Allow-Headers": ["*"], "Date": ["Sat, 29 Oct 2022 23:26:40 GMT"], "X-Powered-By": ["PHP/8.0.25"], "Content-Disposition": ["inline; filename=\"0xa8md3wdsl1xnqu5axrn9img_1740.jpg\""], "Access-Control-Allow-Origin": ["*"], "Server": ["Caddy", "nginx/1.20.2"], "Alt-Svc": ["h3=\":8445\"; ma=2592000"], "Content-Type": ["image/jpeg"], "Access-Control-Allow-Methods": ["GET, POST, PUT, DELETE, OPTIONS"], "Cache-Control": ["max-age=2592000"]}}