Error on uploading avatar or cropping image | cacheableLookup ENOTFOUND #14540

akibasocial · 2024-09-10T21:50:19Z

akibasocial
Sep 10, 2024

💡 Summary

We initially noticed this issue when trying to upload an avatar for a newly created account. Later, we found out that the error also occurs when attempting to crop an image.

This issue arises whether uploading a new image or selecting one from the drive. The error happens even if no cropping is done while changing the avatar.

When a new image is uploaded, the full-resolution image is successfully uploaded to the drive, but it cannot be used.

It's a docker compose installation using the vanilla Docker Hub Image tag: 2024.8.0 and with a object storage setup functional.

🥰 Expected Behavior

Change avatar:

Upload a new image or select one from the drive, and set it as the user avatar.

Crop image during a post:

Edit the image you just uploaded or select one from the drive to crop.

🤬 Actual Behavior

When trying to change the avatar, whether uploading a new image or selecting one from the drive, the operation completes, but I receive a broken image reference.

If I attempt to crop the image, the new window shows a blurred placeholder, and the full image never loads for cropping.

Server log 1

akb-web-1          | This CPU cannot use TensorFlow.
akb-web-1          | INFO *	[drive register]	{"size":90550,"md5":"e67616e709316c859115f05da67987b7","type":{"mime":"image/webp","ext":"webp"},"width":331,"height":331,"blurhash":"eDSEXU=OQ+wOrFyzTbXUXNtnu,Q-X9xEn5x_g3VqRktORsxvyVRjnO","sensitive":false,"porn":false,"warnings":[]}
akb-web-1          | INFO *	[drive register]	web image not created (original satisfies webpublic)
akb-web-1          | INFO *	[drive register]	uploading original: cache/711a163c-f005-43e5-9f6c-9461bdd6d6f0.webp
akb-web-1          | INFO *	[drive register]	uploading thumbnail: cache/thumbnail-6013d73d-a8a2-4349-8bf7-620fdd5cc10e.webp
akb-web-1          | DONE *	[drive register]	drive file has been created 9xyvujadr7
akb-web-1          | {
akb-web-1          |   code: 'BRIEF_REQUEST_INTERVAL',
akb-web-1          |   info: { remaining: 0, reset: 1725909060, resetMs: 1725909060050, total: 1 }
akb-web-1          | }
akb-web-1          | INFO *	[download]	Downloading https://cdn.akiba.social/cache/711a163c-f005-43e5-9f6c-9461bdd6d6f0.webp to /tmp/tmp-117-5bcpALSi9J63 ...
akb-web-1          | ERR  *	[server]	RequestError: cacheableLookup ENOTFOUND cdn.akiba.social

Browser Console log 1

app-DxYu7RcC.js:20 browser-image-resizer: Scale: Started File {name: 'eb7f05f3d8a00f99.png', lastModified: 1725905291194, lastModifiedDate: Mon Sep 09 2024 19:08:11 GMT+0100 (Western European Summer Time), webkitRelativePath: '', size: 118780, …}
app-DxYu7RcC.js:20 browser-image-resizer: original image size = 331 px (width) X 331 px (height)
app-DxYu7RcC.js:20 browser-image-resizer: scaled image size = 331 px (width) X 331 px (height)
app-DxYu7RcC.js:20 browser-image-resizer: scale: maxWidth is 331
avatar.webp:1 
        
        
       GET https://akiba.social/proxy/avatar.webp?url=https%3A%2F%2Fcdn.akiba.social%2Fcache%2F711a163c-f005-43e5-9f6c-9461bdd6d6f0.webp&avatar=1 500 (Internal Server Error)
app-DxYu7RcC.js:18 Error occurred during decoding image <img height="42" width="42" class="xkJBF" src="https://akiba.social/proxy/avatar.webp?url=https%3A%2F%2Fcdn.akiba.social%2Fcache%2F711a163c-f005-43e5-9f6c-9461bdd6d6f0.webp&avatar=1" alt loading="eager" decoding="async" tabindex="-1" style="display: none;"> EncodingError: The source image cannot be decoded.
app-DxYu7RcC.js:18 Error occurred during decoding image <img height="42" width="42" class="xkJBF" src="https://akiba.social/proxy/avatar.webp?url=https%3A%2F%2Fcdn.akiba.social%2Fcache%2F711a163c-f005-43e5-9f6c-9461bdd6d6f0.webp&avatar=1" alt loading="eager" decoding="async" tabindex="-1" style="display: none;"> EncodingError: The source image cannot be decoded.
app-DxYu7RcC.js:18 Error occurred during decoding image <img height="42" width="42" class="xkJBF" src="https://akiba.social/proxy/avatar.webp?url=https%3A%2F%2Fcdn.akiba.social%2Fcache%2F711a163c-f005-43e5-9f6c-9461bdd6d6f0.webp&avatar=1" alt loading="eager" decoding="async" tabindex="-1" style="display: none;"> EncodingError: The source image cannot be decoded.
app-DxYu7RcC.js:18 Error occurred during decoding image <img height="72" width="72" class="xkJBF" src="https://akiba.social/proxy/avatar.webp?url=https%3A%2F%2Fcdn.akiba.social%2Fcache%2F711a163c-f005-43e5-9f6c-9461bdd6d6f0.webp&avatar=1" alt loading="eager" decoding="async" tabindex="-1" style="display: none;"> EncodingError: The source image cannot be decoded.
app-DxYu7RcC.js:18 Error occurred during decoding image <img height="32" width="32" class="xkJBF" src="https://akiba.social/proxy/avatar.webp?url=https%3A%2F%2Fcdn.akiba.social%2Fcache%2F711a163c-f005-43e5-9f6c-9461bdd6d6f0.webp&avatar=1" alt loading="eager" decoding="async" tabindex="-1" style="display: none;"> EncodingError: The source image cannot be decoded.
app-DxYu7RcC.js:18 Error occurred during decoding image <img height="42" width="42" class="xkJBF" src="https://akiba.social/proxy/avatar.webp?url=https%3A%2F%2Fcdn.akiba.social%2Fcache%2F711a163c-f005-43e5-9f6c-9461bdd6d6f0.webp&avatar=1" alt loading="eager" decoding="async" tabindex="-1" style="display: none;"> EncodingError: The source image cannot be decoded.

Server log 2

akb-web-1          | This CPU cannot use TensorFlow.
akb-web-1          | INFO *	[drive register]	{"size":25992,"md5":"6e3d083c469552e88f8e68ebae01fd62","type":{"mime":"image/webp","ext":"webp"},"width":500,"height":468,"blurhash":"ePNmySsC_N%LH?$%S$-;V@M|D+i]t7tRWTt-oerragRixVR.V@j=S6","sensitive":false,"porn":false,"warnings":[]}
akb-web-1          | INFO *	[drive register]	web image not created (original satisfies webpublic)
akb-web-1          | INFO *	[drive register]	uploading original: cache/82564bd9-6e8b-4d09-b9f2-d28a13d2fb89.webp
akb-web-1          | INFO *	[drive register]	uploading thumbnail: cache/thumbnail-fa0a6d49-af89-47b2-b040-95f586e710c5.webp
akb-web-1          | DONE *	[drive register]	drive file has been created 9xz48llf6z
akb-web-1          | INFO *	[download]	Downloading https://cdn.akiba.social/cache/82564bd9-6e8b-4d09-b9f2-d28a13d2fb89.webp to /tmp/tmp-117-HoZHqSqmN06m ...
akb-web-1          | ERR  *	[server]	RequestError: cacheableLookup ENOTFOUND cdn.akiba.social

Browser Console log 2

app-DxYu7RcC.js:20 browser-image-resizer: Scale: Started File {name: 'kachou_avatar.jpeg', lastModified: 1672384114258, lastModifiedDate: Fri Dec 30 2022 07:08:34 GMT+0000 (Western European Standard Time), webkitRelativePath: '', size: 45994, …}
app-DxYu7RcC.js:20 browser-image-resizer: original image size = 500 px (width) X 468 px (height)
app-DxYu7RcC.js:20 browser-image-resizer: scaled image size = 500 px (width) X 468 px (height)
app-DxYu7RcC.js:20 browser-image-resizer: scale: maxWidth is 500
avatar.webp:1 
        
        
        GET https://akiba.social/proxy/avatar.webp?url=https%3A%2F%2Fcdn.akiba.social%2Fcache%2F82564bd9-6e8b-4d09-b9f2-d28a13d2fb89.webp&avatar=1 500 (Internal Server Error)
Image
Cu @ kZBWsCog.js:1
Ou @ kZBWsCog.js:1
k @ kZBWsCog.js:1
R @ kZBWsCog.js:1
b @ kZBWsCog.js:1
I @ kZBWsCog.js:1
pn @ kZBWsCog.js:1
K @ kZBWsCog.js:1
O @ kZBWsCog.js:1
I @ kZBWsCog.js:1
N @ kZBWsCog.js:1
run @ kZBWsCog.js:1
D.f.update @ kZBWsCog.js:1
$e @ kZBWsCog.js:1
Ki @ kZBWsCog.js:1
Promise.then
ji @ kZBWsCog.js:1
zn @ kZBWsCog.js:1
(anonymous) @ kZBWsCog.js:1
Ys @ kZBWsCog.js:1
Ue @ kZBWsCog.js:1
set @ kZBWsCog.js:1
lt @ app-DxYu7RcC.js:2
(anonymous) @ app-DxYu7RcC.js:38
r.emit @ app-DxYu7RcC.js:2
onMessage @ app-DxYu7RcC.js:2
e._callEventListener @ app-DxYu7RcC.js:2
(anonymous) @ app-DxYu7RcC.js:2
_handleMessage @ app-DxYu7RcC.js:2
app-DxYu7RcC.js:18 Error occurred during decoding image <img height="72" width="72" class="xkJBF" src="https://akiba.social/proxy/avatar.webp?url=https%3A%2F%2Fcdn.akiba.social%2Fcache%2F82564bd9-6e8b-4d09-b9f2-d28a13d2fb89.webp&avatar=1" alt loading="eager" decoding="async" tabindex="-1" style> EncodingError: The source image cannot be decoded.
app-DxYu7RcC.js:18 Error occurred during decoding image <img height="32" width="32" class="xkJBF" src="https://akiba.social/proxy/avatar.webp?url=https%3A%2F%2Fcdn.akiba.social%2Fcache%2F82564bd9-6e8b-4d09-b9f2-d28a13d2fb89.webp&avatar=1" alt loading="eager" decoding="async" tabindex="-1" style> EncodingError: The source image cannot be decoded.

Not really sure what happened here

Server log 3

akb-web-1          | {
akb-web-1          |   code: 'BRIEF_REQUEST_INTERVAL',
akb-web-1          |   info: { remaining: 0, reset: 1726004135, resetMs: 1726004135098, total: 1 }
akb-web-1          | }
akb-web-1          | This CPU cannot use TensorFlow.
akb-web-1          | INFO *	[drive register]	{"size":156018,"md5":"14ba7b07b1317e83a6350481a15d30d0","type":{"mime":"image/webp","ext":"webp"},"width":1280,"height":853,"blurhash":"eGC$$UNb00s:_MH@WC?bt7D%E2jFxuRjV@XSs:Mxt6t7adt6M|o0oJ","sensitive":false,"porn":false,"warnings":[]}
akb-web-1          | INFO *	[drive register]	web image not created (original satisfies webpublic)
akb-web-1          | INFO *	[drive register]	uploading original: cache/b727788a-6d3b-4cdb-b600-086830cd8843.webp
akb-web-1          | INFO *	[drive register]	uploading thumbnail: cache/thumbnail-a19616db-9a6d-4c3c-95da-bb19647561a9.webp
akb-web-1          | DONE *	[drive register]	drive file has been created 9y0ggtpp10
akb-web-1          | INFO *	[download]	Downloading https://cdn.akiba.social/cache/b727788a-6d3b-4cdb-b600-086830cd8843.webp to /tmp/tmp-117-7QnMn4YGxDGJ ...
akb-web-1          | ERR  *	[server]	RequestError: cacheableLookup ENOTFOUND cdn.akiba.social

Browser Console log 3

app-DxYu7RcC.js:20 browser-image-resizer: Scale: Started File {name: 'maid-cafe-medewerker.jpg', lastModified: 1725223956841, lastModifiedDate: Sun Sep 01 2024 21:52:36 GMT+0100 (Western European Summer Time), webkitRelativePath: '', size: 240414, …}
app-DxYu7RcC.js:20 browser-image-resizer: original image size = 1280 px (width) X 853 px (height)
app-DxYu7RcC.js:20 browser-image-resizer: scaled image size = 1280 px (width) X 853 px (height)
app-DxYu7RcC.js:20 browser-image-resizer: scale: maxWidth is 1280
image.webp:1 
        
        
        GET https://akiba.social/proxy/image.webp?url=https%3A%2F%2Fcdn.akiba.social%2Fcache%2Fb727788a-6d3b-4cdb-b600-086830cd8843.webp&fallback=1&origin=1 404 (Not Found)
image.webp:1 
        
        
        GET https://akiba.social/proxy/image.webp?url=https%3A%2F%2Fcdn.akiba.social%2Fcache%2Fb727788a-6d3b-4cdb-b600-086830cd8843.webp&fallback=1&origin=1 404 (Not Found)

All images referenced in the logs are still in storage and can be accessed by pasting the URLs into the browser.

📝 Steps to Reproduce

Change avatar:

Edit profile
Change avatar
Upload a new picture or select one from the drive
Confirm image selection
Profile is saved, but a broken image appears
Crop image:

Upload a new picture or select one from the drive

Choose to crop the image
The edit window never loads the full image

💻 Frontend Environment

* Model and OS of the device(s): macOS 14.6.1
* Browser: Microsoft Edge 128
* Server URL: https://akiba.social
* Misskey: 2024.8.0

🛰 Backend Environment (for server admin)

* Installation Method or Hosting Service: Docker Compose
* Misskey: 2024.8.0
* Node: v20.16.0
* PostgreSQL: 15.6
* Redis: 7.2.4
* OS and Architecture: Ubuntu 22.04.4 LTS / Ampere Altra A1 (ARMv8.2-A)
* Object Storage: Cloudflare R2

Do you want to address this bug yourself?

Yes, I will patch the bug myself and send a pull request

akibasocial · 2024-09-12T23:10:34Z

akibasocial
Sep 12, 2024
Author

It was the server DNS resolution having issues with the object storage public address that caused the problem.

To solve we had to make some changes on the resolved.conf file on the server to make it stop trying to resolve the object storage address (a subdomain of the same domain) internally and let it access the internet.

0 replies

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Error on uploading avatar or cropping image | cacheableLookup ENOTFOUND #14540

{{title}}

Replies: 1 comment

{{title}}

Select a reply

Error on uploading avatar or cropping image | cacheableLookup ENOTFOUND #14540

akibasocial Sep 10, 2024

💡 Summary

🥰 Expected Behavior

🤬 Actual Behavior

Server log 1

Browser Console log 1

Server log 2

Browser Console log 2

Server log 3

Browser Console log 3

📝 Steps to Reproduce

💻 Frontend Environment

🛰 Backend Environment (for server admin)

Do you want to address this bug yourself?

Replies: 1 comment

akibasocial Sep 12, 2024 Author

akibasocial
Sep 10, 2024

akibasocial
Sep 12, 2024
Author