Many photos uploaded to volume are rendered as empty/transparent.

thelurkingdev
HOBBYOP

6 months ago

I have created a Volume attached to my node backend service in my app. I have the Mount Path set to "/app/uploads". Some of these files are uploaded by users of the app and some I have pushed as part of deployments. On some pages in the site, the images are fetched and rendered correctly. However in many instances, including one full page, empty images are being returned for these requests. There is a 200 response and there is even a preview image in the browser tools, but the preview image also shows as blank/empty/transparent. Here is an example of one of the images that is not working:
https://noi-site-thai-production.up.railway.app/uploads/empty-profile.png

It is showing up as completely white, but it should be a placeholder empty profile image that I created. There are many other instances like this throughout the site.

I copied the path above from the Sources in the developer tools. I have no idea what I have done wrong and this has been ongoing for nearly 2 weeks now. Can anyone help out?

$10 Bounty

6 Replies

thelurkingdev
HOBBYOP

6 months ago

Here are some flag images that should be seen on all pages, but they are also returned as empty from the volume:

https://noi-site-thai-production.up.railway.app/uploads/flags/en.png
https://noi-site-thai-production.up.railway.app/uploads/flags/zh.png
https://noi-site-thai-production.up.railway.app/uploads/flags/th.png

I tried deleting them in my local dev environment, pushing the changes up and let the service rebuild. Then adding them back locally and pushing, but to no avail. They are still not displayed.


thelurkingdev
HOBBYOP

6 months ago

I am seeing the following errors in my "Observability" view:
2025-05-16 23:33:56.565 UTC [26] LOG: checkpoint starting: time

May 16 19:34:06

Postgres

2025-05-16 23:33:57.722 UTC [26] LOG: checkpoint complete: wrote 12 buffers (0.1%); 0 WAL file(s) added, 0 removed, 0 recycled; write=1.114 s, sync=0.007 s, total=1.158 s; sync files=12, longest=0.005 s, average=0.001 s; distance=64 kB, estimate=146 kB; lsn=0/6C5AC28, redo lsn=0/6C5ABF0

May 16 19:38:56

Postgres

2025-05-16 23:38:56.822 UTC [26] LOG: checkpoint starting: time

May 16 19:38:58

Postgres

2025-05-16 23:38:58.061 UTC [26] LOG: checkpoint complete: wrote 12 buffers (0.1%); 0 WAL file(s) added, 0 removed, 0 recycled; write=1.124 s, sync=0.053 s, total=1.239 s; sync files=12, longest=0.045 s, average=0.005 s; distance=65 kB, estimate=138 kB; lsn=0/6C6B250, redo lsn=0/6C6B218

May 16 19:43:58

Postgres

2025-05-16 23:43:56.161 UTC [26] LOG: checkpoint starting: time

May 16 19:43:58

Postgres

2025-05-16 23:43:57.347 UTC [26] LOG: checkpoint complete: wrote 12 buffers (0.1%); 0 WAL file(s) added, 0 removed, 0 recycled; write=1.122 s, sync=0.017 s, total=1.186 s; sync files=12, longest=0.014 s, average=0.002 s; distance=67 kB, estimate=131 kB; lsn=0/6C7BFA8, redo lsn=0/6C7BF70

May 16 19:48:59

Postgres

2025-05-16 23:48:56.447 UTC [26] LOG: checkpoint starting: time

May 16 19:48:59

Postgres

2025-05-16 23:48:58.678 UTC [26] LOG: checkpoint complete: wrote 20 buffers (0.1%); 0 WAL file(s) added, 0 removed, 0 recycled; write=1.949 s, sync=0.024 s, total=2.232 s; sync files=16, longest=0.019 s, average=0.002 s; distance=103 kB, estimate=128 kB; lsn=0/6C95E70, redo lsn=0/6C95E38

May 16 19:53:59

Postgres

2025-05-16 23:53:56.777 UTC [26] LOG: checkpoint starting: time

May 16 19:53:59

Postgres

2025-05-16 23:53:59.129 UTC [26] LOG: checkpoint complete: wrote 22 buffers (0.1%); 0 WAL file(s) added, 0 removed, 0 recycled; write=2.121 s, sync=0.197 s, total=2.352 s; sync files=19, longest=0.164 s, average=0.011 s; distance=91 kB, estimate=125 kB; lsn=0/6CACD78, redo lsn=0/6CACD40

May 16 19:59:00

Postgres

2025-05-16 23:58:56.226 UTC [26] LOG: checkpoint starting: time

May 16 19:59:00

Postgres

2025-05-16 23:58:57.383 UTC [26] LOG: checkpoint complete: wrote 12 buffers (0.1%); 0 WAL file(s) added, 0 removed, 0 recycled; write=1.113 s, sync=0.019 s, total=1.158 s; sync files=12, longest=0.013 s, average=0.002 s; distance=54 kB, estimate=118 kB; lsn=0/6CBA600, redo lsn=0/6CBA5C8

May 16 20:04:01

Postgres

2025-05-17 00:03:55.166 UTC [5338] LOG: could not receive data from client: Connection reset by peer

May 16 20:04:01

Postgres

2025-05-17 00:03:55.166 UTC [5336] LOG: could not receive data from client: Connection reset by peer

May 16 20:04:01

Postgres

2025-05-17 00:03:56.481 UTC [26] LOG: checkpoint starting: time

May 16 20:04:01

Postgres

2025-05-17 00:03:57.697 UTC [26] LOG: checkpoint complete: wrote 12 buffers (0.1%); 0 WAL file(s) added, 0 removed, 0 recycled; write=1.113 s, sync=0.011 s, total=1.217 s; sync files=12, longest=0.008 s, average=0.001 s; distance=55 kB, estimate=111 kB; lsn=0/6CC8228, redo lsn=0/6CC81F0

level:"error"

View in ContextCopy as JSON

May 16 20:04:52

responsible-exploration

npm warn config production Use --omit=dev instead.

May 16 20:05:01

responsible-exploration

npm error path /app

May 16 20:05:01

responsible-exploration

npm error command failed

May 16 20:05:01

responsible-exploration

npm error signal SIGTERM

May 16 20:05:01

responsible-exploration

npm error command sh -c serve -s dist

May 16 20:05:01

responsible-exploration

npm error A complete log of this run can be found in: /root/.npm/_logs/2025-05-16T23_02_17_456Z-debug-0.log

May 16 20:09:01

Postgres

2025-05-17 00:08:56.797 UTC [26] LOG: checkpoint starting: time

May 16 20:09:01

Postgres

2025-05-17 00:08:58.355 UTC [26] LOG: checkpoint complete: wrote 14 buffers (0.1%); 0 WAL file(s) added, 0 removed, 0 recycled; write=1.345 s, sync=0.034 s, total=1.559 s; sync files=14, longest=0.024 s, average=0.003 s; distance=54 kB, estimate=106 kB; lsn=0/6CD5BF8, redo lsn=0/6CD5BC0


sim
FREE

5 months ago

Is this the pattern? You see the images that you upload at runtime but not from build time?


sim
FREE

5 months ago

Move your static images out of the volume from the mount path because when the volume mounts it will clear all that out


sim
FREE

5 months ago

It's common to store your static images into your repository as assets. Just store them in a folder like /public/assets no need for a volume for that


sim
FREE

5 months ago

Please do not misunderstand you have to use the volume for user uploaded ones though or they will be lost


Loading...
Many photos uploaded to volume are rendered as empty/transparent. - Railway Help Station