[BUG] image donot show preview #1262

Closed
opened 2026-02-05 01:04:12 +03:00 by OVERLORD · 11 comments
Owner

Originally created by @bigsinger on GitHub (Aug 21, 2023).

The bug

image
Clicking to enlarge the image may not display the image correctly, but clicking to download the image will make the file complete

The OS that Immich Server is running on

Windows 10 ,wsl2, docker

Version of Immich Server

v1.74.0

Version of Immich Mobile App

v1.74.0

Platform with the issue

  • Server
  • Web
  • Mobile

Your docker-compose.yml content

version: "3.8"

services:
  immich-server:
    container_name: immich_server
    image: ghcr.io/immich-app/immich-server:release
    command: ["start-server.sh"]
    volumes:
      - ${UPLOAD_LOCATION}:/usr/src/app/upload
    env_file:
      - .env
    depends_on:
      - redis
      - database
      - typesense
    restart: always

  immich-microservices:
    container_name: immich_microservices
    image: ghcr.io/immich-app/immich-server:release
    command: ["start-microservices.sh"]
    volumes:
      - ${UPLOAD_LOCATION}:/usr/src/app/upload
    env_file:
      - .env
    depends_on:
      - redis
      - database
      - typesense
    restart: always

  immich-machine-learning:
    container_name: immich_machine_learning
    image: ghcr.io/immich-app/immich-machine-learning:release
    volumes:
      - ${UPLOAD_LOCATION}:/usr/src/app/upload
      - model-cache:/cache
    env_file:
      - .env
    restart: always

  immich-web:
    container_name: immich_web
    image: ghcr.io/immich-app/immich-web:release
    env_file:
      - .env
    restart: always

  typesense:
    container_name: immich_typesense
    image: typesense/typesense:0.24.0
    environment:
      - TYPESENSE_API_KEY=${TYPESENSE_API_KEY}
      - TYPESENSE_DATA_DIR=/data
    logging:
      driver: none
    volumes:
      - tsdata:/data
    restart: always

  redis:
    container_name: immich_redis
    image: redis:6.2
    restart: always

  database:
    container_name: immich_postgres
    image: postgres:14
    env_file:
      - .env
    environment:
      POSTGRES_PASSWORD: ${DB_PASSWORD}
      POSTGRES_USER: ${DB_USERNAME}
      POSTGRES_DB: ${DB_DATABASE_NAME}
      PG_DATA: /var/lib/postgresql/data
    volumes:
      - pgdata:/var/lib/postgresql/data
    restart: always

  immich-proxy:
    container_name: immich_proxy
    image: ghcr.io/immich-app/immich-proxy:release
    environment:
      # Make sure these values get passed through from the env file
      - IMMICH_SERVER_URL
      - IMMICH_WEB_URL
    ports:
      - 2283:8080
    depends_on:
      - immich-server
    restart: always

volumes:
  pgdata:
  model-cache:
  tsdata:

Your .env content

###################################################################################
# Database
###################################################################################

# NOTE: The following four database variables support Docker secrets by adding a *_FILE suffix to the variable name
# See the docker-compose documentation on secrets for additional details: https://docs.docker.com/compose/compose-file/compose-file-v3/#secrets
DB_HOSTNAME=immich_postgres
DB_USERNAME=postgres
DB_PASSWORD=postgres
DB_DATABASE_NAME=immich

# Optional Database settings:
# DB_PORT=5432

###################################################################################
# Redis
###################################################################################

REDIS_HOSTNAME=immich_redis

# REDIS_URL will be used to pass custom options to ioredis.
# Example for Sentinel
# {"sentinels":[{"host":"redis-sentinel-node-0","port":26379},{"host":"redis-sentinel-node-1","port":26379},{"host":"redis-sentinel-node-2","port":26379}],"name":"redis-sentinel"}
# REDIS_URL=ioredis://eyJzZW50aW5lbHMiOlt7Imhvc3QiOiJyZWRpcy1zZW50aW5lbDEiLCJwb3J0IjoyNjM3OX0seyJob3N0IjoicmVkaXMtc2VudGluZWwyIiwicG9ydCI6MjYzNzl9XSwibmFtZSI6Im15bWFzdGVyIn0=

# Optional Redis settings:

# Note: these parameters are not automatically passed to the Redis Container
# to do so, please edit the docker-compose.yml file as well. Redis is not configured
# via environment variables, only redis.conf or the command line

# REDIS_PORT=6379
# REDIS_DBINDEX=0
# REDIS_USERNAME=
# REDIS_PASSWORD=
# REDIS_SOCKET=

###################################################################################
# Upload File Location
#
# This is the location where uploaded files are stored.
###################################################################################

UPLOAD_LOCATION=/mnt/e/docker/immich/immich-app/immich-data


###################################################################################
# Typesense
###################################################################################
TYPESENSE_API_KEY=some-random-text
# TYPESENSE_ENABLED=false
# TYPESENSE_URL uses base64 encoding for the nodes json.
# Example JSON that was used:
# [
#      { 'host': 'typesense-1.example.net', 'port': '443', 'protocol': 'https' },
#      { 'host': 'typesense-2.example.net', 'port': '443', 'protocol': 'https' },
#      { 'host': 'typesense-3.example.net', 'port': '443', 'protocol': 'https' },
#  ]
# TYPESENSE_URL=ha://WwogICAgeyAnaG9zdCc6ICd0eXBlc2Vuc2UtMS5leGFtcGxlLm5ldCcsICdwb3J0JzogJzQ0MycsICdwcm90b2NvbCc6ICdodHRwcycgfSwKICAgIHsgJ2hvc3QnOiAndHlwZXNlbnNlLTIuZXhhbXBsZS5uZXQnLCAncG9ydCc6ICc0NDMnLCAncHJvdG9jb2wnOiAnaHR0cHMnIH0sCiAgICB7ICdob3N0JzogJ3R5cGVzZW5zZS0zLmV4YW1wbGUubmV0JywgJ3BvcnQnOiAnNDQzJywgJ3Byb3RvY29sJzogJ2h0dHBzJyB9LApd

###################################################################################
# Reverse Geocoding
#
# Reverse geocoding is done locally which has a small impact on memory usage
# This memory usage can be altered by changing the REVERSE_GEOCODING_PRECISION variable
# This ranges from 0-3 with 3 being the most precise
# 3 - Cities > 500 population: ~200MB RAM
# 2 - Cities > 1000 population: ~150MB RAM
# 1 - Cities > 5000 population: ~80MB RAM
# 0 - Cities > 15000 population: ~40MB RAM
####################################################################################

# DISABLE_REVERSE_GEOCODING=false
# REVERSE_GEOCODING_PRECISION=3

####################################################################################
# WEB - Optional
#
# Custom message on the login page, should be written in HTML form.
# For example:
# PUBLIC_LOGIN_PAGE_MESSAGE="This is a demo instance of Immich.<br><br>Email: <i>demo@demo.de</i><br>Password: <i>demo</i>"
####################################################################################

PUBLIC_LOGIN_PAGE_MESSAGE=

####################################################################################
# Alternative Service Addresses - Optional
#
# This is an advanced feature for users who may be running their immich services on different hosts.
# It will not change which address or port that services bind to within their containers, but it will change where other services look for their peers.
# Note: immich-microservices is bound to 3002, but no references are made
####################################################################################

IMMICH_WEB_URL=http://immich-web:3000
IMMICH_SERVER_URL=http://immich-server:3001
IMMICH_MACHINE_LEARNING_URL=http://immich-machine-learning:3003

####################################################################################
# Alternative API's External Address - Optional
#
# This is an advanced feature used to control the public server endpoint returned to clients during Well-known discovery.
# You should only use this if you want mobile apps to access the immich API over a custom URL. Do not include trailing slash.
# NOTE: At this time, the web app will not be affected by this setting and will continue to use the relative path: /api
# Examples: http://localhost:3001, http://immich-api.example.com, etc
####################################################################################

#IMMICH_API_URL_EXTERNAL=http://localhost:3001

Reproduction steps

1.
2.
3.
...

Additional information

No response

Originally created by @bigsinger on GitHub (Aug 21, 2023). ### The bug ![image](https://github.com/immich-app/immich/assets/14847818/c5a64b28-13d4-47f3-9961-6897547f3590) Clicking to enlarge the image may not display the image correctly, but clicking to download the image will make the file complete ### The OS that Immich Server is running on Windows 10 ,wsl2, docker ### Version of Immich Server v1.74.0 ### Version of Immich Mobile App v1.74.0 ### Platform with the issue - [ ] Server - [X] Web - [ ] Mobile ### Your docker-compose.yml content ```YAML version: "3.8" services: immich-server: container_name: immich_server image: ghcr.io/immich-app/immich-server:release command: ["start-server.sh"] volumes: - ${UPLOAD_LOCATION}:/usr/src/app/upload env_file: - .env depends_on: - redis - database - typesense restart: always immich-microservices: container_name: immich_microservices image: ghcr.io/immich-app/immich-server:release command: ["start-microservices.sh"] volumes: - ${UPLOAD_LOCATION}:/usr/src/app/upload env_file: - .env depends_on: - redis - database - typesense restart: always immich-machine-learning: container_name: immich_machine_learning image: ghcr.io/immich-app/immich-machine-learning:release volumes: - ${UPLOAD_LOCATION}:/usr/src/app/upload - model-cache:/cache env_file: - .env restart: always immich-web: container_name: immich_web image: ghcr.io/immich-app/immich-web:release env_file: - .env restart: always typesense: container_name: immich_typesense image: typesense/typesense:0.24.0 environment: - TYPESENSE_API_KEY=${TYPESENSE_API_KEY} - TYPESENSE_DATA_DIR=/data logging: driver: none volumes: - tsdata:/data restart: always redis: container_name: immich_redis image: redis:6.2 restart: always database: container_name: immich_postgres image: postgres:14 env_file: - .env environment: POSTGRES_PASSWORD: ${DB_PASSWORD} POSTGRES_USER: ${DB_USERNAME} POSTGRES_DB: ${DB_DATABASE_NAME} PG_DATA: /var/lib/postgresql/data volumes: - pgdata:/var/lib/postgresql/data restart: always immich-proxy: container_name: immich_proxy image: ghcr.io/immich-app/immich-proxy:release environment: # Make sure these values get passed through from the env file - IMMICH_SERVER_URL - IMMICH_WEB_URL ports: - 2283:8080 depends_on: - immich-server restart: always volumes: pgdata: model-cache: tsdata: ``` ### Your .env content ```Shell ################################################################################### # Database ################################################################################### # NOTE: The following four database variables support Docker secrets by adding a *_FILE suffix to the variable name # See the docker-compose documentation on secrets for additional details: https://docs.docker.com/compose/compose-file/compose-file-v3/#secrets DB_HOSTNAME=immich_postgres DB_USERNAME=postgres DB_PASSWORD=postgres DB_DATABASE_NAME=immich # Optional Database settings: # DB_PORT=5432 ################################################################################### # Redis ################################################################################### REDIS_HOSTNAME=immich_redis # REDIS_URL will be used to pass custom options to ioredis. # Example for Sentinel # {"sentinels":[{"host":"redis-sentinel-node-0","port":26379},{"host":"redis-sentinel-node-1","port":26379},{"host":"redis-sentinel-node-2","port":26379}],"name":"redis-sentinel"} # REDIS_URL=ioredis://eyJzZW50aW5lbHMiOlt7Imhvc3QiOiJyZWRpcy1zZW50aW5lbDEiLCJwb3J0IjoyNjM3OX0seyJob3N0IjoicmVkaXMtc2VudGluZWwyIiwicG9ydCI6MjYzNzl9XSwibmFtZSI6Im15bWFzdGVyIn0= # Optional Redis settings: # Note: these parameters are not automatically passed to the Redis Container # to do so, please edit the docker-compose.yml file as well. Redis is not configured # via environment variables, only redis.conf or the command line # REDIS_PORT=6379 # REDIS_DBINDEX=0 # REDIS_USERNAME= # REDIS_PASSWORD= # REDIS_SOCKET= ################################################################################### # Upload File Location # # This is the location where uploaded files are stored. ################################################################################### UPLOAD_LOCATION=/mnt/e/docker/immich/immich-app/immich-data ################################################################################### # Typesense ################################################################################### TYPESENSE_API_KEY=some-random-text # TYPESENSE_ENABLED=false # TYPESENSE_URL uses base64 encoding for the nodes json. # Example JSON that was used: # [ # { 'host': 'typesense-1.example.net', 'port': '443', 'protocol': 'https' }, # { 'host': 'typesense-2.example.net', 'port': '443', 'protocol': 'https' }, # { 'host': 'typesense-3.example.net', 'port': '443', 'protocol': 'https' }, # ] # TYPESENSE_URL=ha://WwogICAgeyAnaG9zdCc6ICd0eXBlc2Vuc2UtMS5leGFtcGxlLm5ldCcsICdwb3J0JzogJzQ0MycsICdwcm90b2NvbCc6ICdodHRwcycgfSwKICAgIHsgJ2hvc3QnOiAndHlwZXNlbnNlLTIuZXhhbXBsZS5uZXQnLCAncG9ydCc6ICc0NDMnLCAncHJvdG9jb2wnOiAnaHR0cHMnIH0sCiAgICB7ICdob3N0JzogJ3R5cGVzZW5zZS0zLmV4YW1wbGUubmV0JywgJ3BvcnQnOiAnNDQzJywgJ3Byb3RvY29sJzogJ2h0dHBzJyB9LApd ################################################################################### # Reverse Geocoding # # Reverse geocoding is done locally which has a small impact on memory usage # This memory usage can be altered by changing the REVERSE_GEOCODING_PRECISION variable # This ranges from 0-3 with 3 being the most precise # 3 - Cities > 500 population: ~200MB RAM # 2 - Cities > 1000 population: ~150MB RAM # 1 - Cities > 5000 population: ~80MB RAM # 0 - Cities > 15000 population: ~40MB RAM #################################################################################### # DISABLE_REVERSE_GEOCODING=false # REVERSE_GEOCODING_PRECISION=3 #################################################################################### # WEB - Optional # # Custom message on the login page, should be written in HTML form. # For example: # PUBLIC_LOGIN_PAGE_MESSAGE="This is a demo instance of Immich.<br><br>Email: <i>demo@demo.de</i><br>Password: <i>demo</i>" #################################################################################### PUBLIC_LOGIN_PAGE_MESSAGE= #################################################################################### # Alternative Service Addresses - Optional # # This is an advanced feature for users who may be running their immich services on different hosts. # It will not change which address or port that services bind to within their containers, but it will change where other services look for their peers. # Note: immich-microservices is bound to 3002, but no references are made #################################################################################### IMMICH_WEB_URL=http://immich-web:3000 IMMICH_SERVER_URL=http://immich-server:3001 IMMICH_MACHINE_LEARNING_URL=http://immich-machine-learning:3003 #################################################################################### # Alternative API's External Address - Optional # # This is an advanced feature used to control the public server endpoint returned to clients during Well-known discovery. # You should only use this if you want mobile apps to access the immich API over a custom URL. Do not include trailing slash. # NOTE: At this time, the web app will not be affected by this setting and will continue to use the relative path: /api # Examples: http://localhost:3001, http://immich-api.example.com, etc #################################################################################### #IMMICH_API_URL_EXTERNAL=http://localhost:3001 ``` ### Reproduction steps ```bash 1. 2. 3. ... ``` ### Additional information _No response_
Author
Owner

@bo0tzz commented on GitHub (Aug 21, 2023):

Can you provide some more information? For example: Are these pictures you just uploaded, are any of the jobs still running, have you changed anything about your deployment recently, are there any errors in the logs?

@bo0tzz commented on GitHub (Aug 21, 2023): Can you provide some more information? For example: Are these pictures you just uploaded, are any of the jobs still running, have you changed anything about your deployment recently, are there any errors in the logs?
Author
Owner

@dtirer commented on GitHub (Aug 22, 2023):

I'm also having this issue. For me, it was images that I just uploaded via the mobile app in bulk. Some of them displayed fine, but a number of them displayed like the OP shows above.

Interestingly, those same images display fine within the mobile app, so I'm only experiencing this problem on the web app

@dtirer commented on GitHub (Aug 22, 2023): I'm also having this issue. For me, it was images that I just uploaded via the mobile app in bulk. Some of them displayed fine, but a number of them displayed like the OP shows above. Interestingly, those same images display fine within the mobile app, so I'm only experiencing this problem on the web app
Author
Owner

@bigsinger commented on GitHub (Aug 22, 2023):

Can you provide some more information? For example: Are these pictures you just uploaded, are any of the jobs still running, have you changed anything about your deployment recently, are there any errors in the logs?

I used version 1.59.1 before, which was good and hasn't been used for a while. I discovered this issue yesterday and upgraded it to version 1.74 through Docker, including the mobile app, which has also been upgraded to the same version 1.74. But the problem is still that the photos are synchronized through the mobile app, and the app prompts that the backup was successful. However, the preview images on the web end are all problematic and cannot be previewed. Clicking on the large image also cannot display it. However, clicking on the download button shows that the downloaded file is complete and can be opened and displayed on the computer.

@bigsinger commented on GitHub (Aug 22, 2023): > Can you provide some more information? For example: Are these pictures you just uploaded, are any of the jobs still running, have you changed anything about your deployment recently, are there any errors in the logs? I used version 1.59.1 before, which was good and hasn't been used for a while. I discovered this issue yesterday and upgraded it to version 1.74 through Docker, including the mobile app, which has also been upgraded to the same version 1.74. But the problem is still that the photos are synchronized through the mobile app, and the app prompts that the backup was successful. However, the preview images on the web end are all problematic and cannot be previewed. Clicking on the large image also cannot display it. However, clicking on the download button shows that the downloaded file is complete and can be opened and displayed on the computer.
Author
Owner

@alextran1502 commented on GitHub (Aug 22, 2023):

@bigsinger Oh man, this is a huge jump in version for you. Do you see any abnormal coming from the logs? We probably have breaking changes that required you to have manual intervention. My guess is that microservices container are not starting/running properly so that the thumbnails aren't generated

@alextran1502 commented on GitHub (Aug 22, 2023): @bigsinger Oh man, this is a huge jump in version for you. Do you see any abnormal coming from the logs? We probably have breaking changes that required you to have manual intervention. My guess is that microservices container are not starting/running properly so that the thumbnails aren't generated
Author
Owner

@bigsinger commented on GitHub (Aug 22, 2023):

@bigsinger Oh man, this is a huge jump in version for you. Do you see any abnormal coming from the logs? We probably have breaking changes that required you to have manual intervention. My guess is that microservices container are not starting/running properly so that the thumbnails aren't generated

I don't need to know the cause of the problem, please tell me how to solve it? By what means can the picture be displayed?

@bigsinger commented on GitHub (Aug 22, 2023): > @bigsinger Oh man, this is a huge jump in version for you. Do you see any abnormal coming from the logs? We probably have breaking changes that required you to have manual intervention. My guess is that microservices container are not starting/running properly so that the thumbnails aren't generated I don't need to know the cause of the problem, please tell me how to solve it? By what means can the picture be displayed?
Author
Owner

@alextran1502 commented on GitHub (Aug 22, 2023):

@bigsinger Ah, easy, without knowing more about your issue, the best way to fix it is to nuke your installation and start from scratch.

@alextran1502 commented on GitHub (Aug 22, 2023): @bigsinger Ah, easy, without knowing more about your issue, the best way to fix it is to nuke your installation and start from scratch.
Author
Owner

@bigsinger commented on GitHub (Aug 22, 2023):

Ah, easy, without knowing more about your issue, the best way to fix it is to nuke your installation and start from scratch.

Will this damage the previously backed up files? Is the previously backed up file still valid after reinstallation?

@bigsinger commented on GitHub (Aug 22, 2023): > Ah, easy, without knowing more about your issue, the best way to fix it is to nuke your installation and start from scratch. Will this damage the previously backed up files? Is the previously backed up file still valid after reinstallation?
Author
Owner

@alextran1502 commented on GitHub (Aug 22, 2023):

@bigsinger The files will still be stored in your upload location so you can do bulk upload from the library folder

@alextran1502 commented on GitHub (Aug 22, 2023): @bigsinger The files will still be stored in your upload location so you can do bulk upload from the library folder
Author
Owner

@bigsinger commented on GitHub (Aug 22, 2023):

@bigsinger The files will still be stored in your upload location so you can do bulk upload from the library folder

Sounds like a big project

@bigsinger commented on GitHub (Aug 22, 2023): > @bigsinger The files will still be stored in your upload location so you can do bulk upload from the library folder Sounds like a big project
Author
Owner

@alextran1502 commented on GitHub (Aug 22, 2023):

Sounds like it but actually not 😉

@alextran1502 commented on GitHub (Aug 22, 2023): Sounds like it but actually not 😉
Author
Owner

@bigsinger commented on GitHub (Oct 9, 2023):

@bigsinger The files will still be stored in your upload location so you can do bulk upload from the library folder

@alextran1502

Is there any help document for this?

I plan to start solving this problem recently.

I must upload all the historical photos and not lose them.

3Q

@bigsinger commented on GitHub (Oct 9, 2023): > @bigsinger The files will still be stored in your upload location so you can do bulk upload from the library folder @alextran1502 Is there any help document for this? I plan to start solving this problem recently. I must upload all the historical photos and not lose them. 3Q
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: immich-app/immich#1262