System Information
- Strapi Version: 4.14.0
- Operating System: macOS Sonoma 14.1.1
- Database: Postgres 16
- Node Version: 18.19.1
- NPM Version: 10.5.0
- Yarn Version:
Hi,
I’m currently building a Strapi project using Docker, and I’m having trouble viewing images on the web interface. Everything else, like JavaScript files, seems to load fine, but images (such as PNG and SVG) are not displaying properly.
Dockerfile
FROM node:18.19.1
RUN apt-get update && apt-get install -y libvips-dev
WORKDIR /code
COPY . /code
RUN npm install -g npm@10.5.0
RUN npm install
RUN npm run build
compose.yml
services:
app:
image: app:latest
build:
context: .
dockerfile: docker/app/Dockerfile
platform: linux/amd64
ports:
- 3000:3000
env_file:
- .env
depends_on:
- postgres
command: npm run start
postgres:
image: postgres:16
restart: always
ports:
- 15432:5432
environment:
POSTGRES_USER: postres
POSTGRES_PASSWORD: password
Using ngrok, localhost:3000 was published https.
ngrok (Ctrl+C to quit)
Help shape K8s Bindings https://ngrok.com/new-features-update?ref=k8s
Session Status online
Account ななといつ (Plan: Free)
Update update available (version 3.17.0, Ctrl-U to update)
Version 3.14.0
Region Asia Pacific (ap)
Latency 152ms
Web Interface http://127.0.0.1:4040
Forwarding https://xxxx-xxx-xxx-xxx-xx.ngrok-free.app -> http://localhost:3000
Connections ttl opn rt1 rt5 p50 p90
I entered the https address output in the environment variable URL and ran docker compose up.
app-1 |
app-1 | > app@0.1.0 start
app-1 | > NODE_ENV=default node node_modules/@strapi/strapi/bin/strapi.js start
app-1 |
app-1 |
app-1 | Project information
app-1 |
app-1 | ┌────────────────────┬──────────────────────────────────────────────────┐
app-1 | │ Time │ Thu Oct 10 2024 19:52:46 GMT+0000 (Coordinated … │
app-1 | │ Launched in │ 2154 ms │
app-1 | │ Environment │ default │
app-1 | │ Process PID │ 19 │
app-1 | │ Version │ 4.14.0 (node v18.19.1) │
app-1 | │ Edition │ Community │
app-1 | │ Database │ postgres │
app-1 | └────────────────────┴──────────────────────────────────────────────────┘
app-1 |
app-1 | Actions available
app-1 |
app-1 | Welcome back!
app-1 | To manage your project 🚀, go to the administration panel at:
app-1 | https://xxxx-xxx-xxx-xxx-xx.ngrok-free.app/admin
app-1 |
app-1 | To access the server ⚡️, go to:
app-1 | https://xxxx-xxx-xxx-xxx-xx.ngrok-free.app
app-1 |
When I accessed the https address, the js was loaded, but only the png was not.
Logging in was normal, and the logo image and other image icons were not displayed after logging in.
This issue seems to affect only image files (PNG, SVG), while other resources load as expected.
Please help me resolve this issue and get the images to load properly?
Thank you.