我在写一个全栈的应用,前端写了Angular,用nginx docker服务,通过和后端的通信就可以接收数据,其中就有Imagepath,这样就可以在本地显示图片了,但我觉得是Docker和Nginx的原因,即使图片路径正确也不显示,我留下一个图片作为例子,图像src部分是正确的。如果我在容器中转到这个路径,我可以看到图片,但我不能在屏幕上看到图片。Didn't show image
我的nginx.conf文件:
worker_processes 1;
events {
worker_connections 1024;
}
http {
server {
listen 80;
server_name localhost;
root /usr/share/nginx/html/browser;
index index.html index.htm;
include /etc/nginx/mime.types;
gzip on;
gzip_http_version 1.1;
gzip_disable "MSIE [1-6]\.";
gzip_min_length 256;
gzip_vary on;
gzip_proxied expired no-cache no-store private auth;
gzip_types text/plain text/css application/json application/javascript application/x-javascript text/xml application/xml application/xml+rss text/javascript;
gzip_comp_level 9;
location / {
try_files $uri $uri/ /index.html;
add_header Access-Control-Allow-Origin *;
}
location /users_books_pictures/ {
alias /usr/share/nginx/html/data/;
}
}
}
字符串
前端的Dockerfile:
FROM node:20.10-alpine AS build
WORKDIR /app
COPY package*.json .
RUN npm install
RUN npx ngcc --properties es2023 browser module main --first-only --create-ivy-entry-points
COPY . .
RUN npm run build --prod
FROM nginx:stable
COPY --from=build /app/dist/librari-fy/ /usr/share/nginx/html
COPY nginx.conf /etc/nginx/nginx.conf
EXPOSE 80
型
Docker-compose文件:
version: '3.8'
services:
postgres:
image: postgres:16-alpine
container_name: postgredatabase
restart: always
environment:
POSTGRES_PASSWORD: password
POSTGRES_USER: admin
POSTGRES_DB: Library
ports:
- "5432:5432"
volumes:
- postgres_data:/var/lib/postgresql/data
networks:
- app_internal_network
healthcheck:
test: pg_isready
interval: 10s
timeout: 60s
retries: 5
start_period: 80s
backend:
image: sahinyakici/librarybackend:latest
restart: always
container_name: backend
depends_on:
postgres:
condition: service_healthy
networks:
- app_internal_network
ports:
- "8080:80"
volumes:
- postgres_data:/app/users_books_pictures
frontend:
container_name: librarify
image: sahinyakici/librarify:latest
restart: always
depends_on:
- backend
networks:
- app_internal_network
ports:
- 80:80
expose:
- 80
volumes:
- postgres_data:/usr/share/nginx/html/data
volumes:
postgres_data:
networks:
app_internal_network:
driver: bridge
型
我改变了Nginx的配置,并在论坛上寻找答案,但找不到。
Incoming data的
1条答案
按热度按时间9w11ddsr1#
NGINX服务器的
root
URL已经设置为/usr/share/nginx/html/browser
,所以你不需要在imagePath
数据中添加这个前缀。NGINX默认会在根文件夹中查找,并尝试从根文件夹中获取URL指定路径的资源。因此,您需要删除
imagePath
数据的/usr/share/nginx/html/browser
前缀,它应该可以做到这一点:)