I have 404 errors instead of my images

[0m3r]

@zetlen
I have 404 errors instead of my images when I enable 'onboard' in pwa-studio
I'm a newbie in the Node/PWA-studio/UPWARD/React/... stack so I can miss something

[x] bug report
[ ] feature request
[ ] question about the decisions made in the repository
[x] question about how to use this project

Maybe the problem is in my Amazon Linux machine

uname -a 
Linux ip-172-30-1-176.ec2.internal 4.14.209-160.339.amzn2.x86_64 #1 SMP Wed Dec 16 22:44:04 UTC 2020 x86_64 x86_64 x86_64 GNU/Linux
[ec2-user@ip-172-30-1-176 ~]$ node -v 
v15.8.0
[ec2-user@ip-172-30-1-176 ~]$ yarn -v 
1.22.5

in my pwa-studio/.env

IMAGE_OPTIMIZING_ORIGIN=onboard

I had a warning about sharp before

ℹ  Launching UPWARD server
Cannot add image optimization middleware due to dependencies that are not installed or are not compatible with this environment:
- hastily: Reason: Cannot find module 'sharp'
- hastily: Reason: Cannot read property 'imageopto' of undefined

So I tried to fix it with

npm install -g sharp
yarn add sharp

npm install -g node-gyp

Now I don't have any warning but have many 404 errors like this one

https://pwa.swissupdemo.com/pub/media/catalog/product/cache/c5d1db256a219b7d2f8fe15bff708c13/w/s/wsh05-blue_main_1.jpg?auto=webp&format=pjpg&width=960&height=1200&fit=cover

I'm trying to debug it, but it is complicated for me

 NODE_ENV=development DEBUG=hastily:* /home/ec2-user/.nvm/versions/node/v15.8.0/bin/node /home/ec2-user/pwa-studio-fundamentals/node_modules/.bin/buildpack serve .
  ℹ  Launching UPWARD server
[1614328096072] DEBUG (hastily:middleware/8246 on ip-172-30-1-176.ec2.internal): creating new middleware
[1614328096074] DEBUG (hastily:middleware/8246 on ip-172-30-1-176.ec2.internal): middleware filtering req.path for \/.+\.(jpeg|png|webp|tiff|gif|heif|raw|jpg)(?:[?#].*)?
https://pwa.swissupdemo.com:9367/
  ✔
     UPWARD server running.
....
[1614328724432] DEBUG (hastily:splice/8246 on ip-172-30-1-176.ec2.internal): res.write() has no access to stream yet. calling underlying response
[1614328724434] DEBUG (hastily:splice/8246 on ip-172-30-1-176.ec2.internal): outgoing response.write() called with chunk of length 1363
[1614328724434] DEBUG (hastily:splice/8246 on ip-172-30-1-176.ec2.internal): response.write(): this._header is false, calling this._implicitHeader()
[1614328724434] DEBUG (hastily:request/8246 on ip-172-30-1-176.ec2.internal): no transform: res.statusCode must be 2xx but is 404
    req: "/media/easyslide/argento/stripes/brands/nike.png"
[1614328724434] DEBUG (hastily:splice/8246 on ip-172-30-1-176.ec2.internal): res.write() has no access to stream yet. calling underlying response
GET /media/easyslide/argento/stripes/argento_stripes_slider2.png 404 1907.818 ms - -
GET /media/easyslide/argento/stripes/brands/nike.png 404 1858.301 ms - -
[1614328724436] DEBUG (hastily:splice/8246 on ip-172-30-1-176.ec2.internal): res.on called for "unpipe" event
[1614328724436] DEBUG (hastily:splice/8246 on ip-172-30-1-176.ec2.internal): 0 listeners, eventType unpipe, calling underlying res.on
[1614328724437] DEBUG (hastily:splice/8246 on ip-172-30-1-176.ec2.internal): res.on called for "close" event
[1614328724437] DEBUG (hastily:splice/8246 on ip-172-30-1-176.ec2.internal): 0 listeners, eventType close, calling underlying res.on
[1614328724437] DEBUG (hastily:splice/8246 on ip-172-30-1-176.ec2.internal): res.on called for "finish" event
[1614328724437] DEBUG (hastily:splice/8246 on ip-172-30-1-176.ec2.internal): 0 listeners, eventType finish, calling underlying res.on
[1614328724437] DEBUG (hastily:splice/8246 on ip-172-30-1-176.ec2.internal): outgoing response.write() called with chunk of length 1363
[1614328724437] DEBUG (hastily:splice/8246 on ip-172-30-1-176.ec2.internal): response.write(): this._header is false, calling this._implicitHeader()
[1614328724437] DEBUG (hastily:request/8246 on ip-172-30-1-176.ec2.internal): no transform: res.statusCode must be 2xx but is 404
    req: "/media/easyslide/argento/stripes/brands/garmin.jpg"
[1614328724437] DEBUG (hastily:splice/8246 on ip-172-30-1-176.ec2.internal): res.write() has no access to stream yet. calling underlying response
[1614328724442] DEBUG (hastily:splice/8246 on ip-172-30-1-176.ec2.internal): res.on called for "unpipe" event
[1614328724442] DEBUG (hastily:splice/8246 on ip-172-30-1-176.ec2.internal): 0 listeners, eventType unpipe, calling underlying res.on
[1614328724442] DEBUG (hastily:splice/8246 on ip-172-30-1-176.ec2.internal): res.on called for "close" event
[1614328724442] DEBUG (hastily:splice/8246 on ip-172-30-1-176.ec2.internal): 0 listeners, eventType close, calling underlying res.on
[1614328724442] DEBUG (hastily:splice/8246 on ip-172-30-1-176.ec2.internal): res.on called for "finish" event
[1614328724442] DEBUG (hastily:splice/8246 on ip-172-30-1-176.ec2.internal): 0 listeners, eventType finish, calling underlying res.on
[1614328724443] DEBUG (hastily:splice/8246 on ip-172-30-1-176.ec2.internal): outgoing response.write() called with chunk of length 1363
[1614328724443] DEBUG (hastily:splice/8246 on ip-172-30-1-176.ec2.internal): response.write(): this._header is false, calling this._implicitHeader()
[1614328724443] DEBUG (hastily:request/8246 on ip-172-30-1-176.ec2.internal): no transform: res.statusCode must be 2xx but is 404
    req: "/media/easyslide/argento/stripes/argento_stripes_slider1.png"
[1614328724443] DEBUG (hastily:splice/8246 on ip-172-30-1-176.ec2.internal): res.write() has no access to stream yet. calling underlying response
GET /media/easyslide/argento/stripes/brands/garmin.jpg 404 1895.655 ms - -
GET /media/easyslide/argento/stripes/argento_stripes_slider1.png 404 1921.863 ms - -

Can you help me with it? I appreciate any ideas

I guess this is a related issue: magento/pwa-studio#1570