Images and/or thumbnails are blurry or missing on default APP_URL: localhost:8000

[bmentink]

Lychee version

v7.5.4

Did you check the latest Lychee version?

Yes, I did

Which PHP version are you using?

PHP 8.5

Detailed description of the problem

When I originally loaded the docker_compose file onto my server (Dockge on Umbrel) as soon as I upload an image, it shows up blurry or missing. That was with default: APP_URL: http://localhost:8000

I then changed it to: APP_URL: http://192.168.1.54:8000 (my server IP) the original file uploaded was still wrong, but new images that I uploaded were fine.

I then changed it to my domain as in: APP_URL: http://mydomain.com:8000, which has the port forwarded.
The images are again blurry or missing. Even if I upload new images to that URL.
EDIT: Note, the above server already has a web server on ports 80/443

Going back to: APP_URL: http://192.168.1.54:8000, it's still broken, I am at a loss as what to do next.
I see there are some permission warnings, but I do not know how to resolve that.

Here is my docker compose file

services:
  lychee:
    image: ghcr.io/lycheeorg/lychee:latest
    container_name: lychee
    ports:
      - 8000:8000
    volumes:
      - ./lychee/uploads:/app/public/uploads
      - ./lychee/logs:/app/storage/logs
      - ./lychee/tmp:/app/storage/tmp
    environment:
      TIMEZONE: Pacific/Auckland
      APP_URL: http://192.168.1.54:8000
      DB_CONNECTION: mysql
      DB_HOST: lychee_db
      DB_PORT: 3306
      DB_DATABASE: lychee
      DB_USERNAME: lychee
      DB_PASSWORD: lychee_password
      # Generate the APP_KEY with `echo "base64:$(openssl rand -base64 32)"` and set it here (without the < >)
      # APP_KEY: base64:<result of 'openssl rand -base64 32'>
      APP_KEY: base64:QJ3QU2PWhkjvxBKw3lSxgq4yJVZMcxxxxxxxxxxxxxxx
    depends_on:
      lychee_db:
        condition: service_healthy
    restart: unless-stopped
  lychee_db:
    image: mariadb:11
    container_name: lychee_db
    environment:
      MYSQL_DATABASE: lychee
      MYSQL_USER: lychee
      MYSQL_PASSWORD: lychee_password
      MYSQL_ROOT_PASSWORD: root_password
    volumes:
      - lychee_db:/var/lib/mysql
    healthcheck:
      test:
        - CMD
        - healthcheck.sh
        - --connect
        - --innodb_initialized
      interval: 5s
      timeout: 3s
      retries: 10
    restart: unless-stopped
volumes:
  lychee_db: null
networks: {}

Steps to reproduce the issue

I can reproduce the error by doing what I described in the description.

Diagnostics [REQUIRED]

Self-diagnosis
info
Hash: fbaa87998d4dc531—62c26e2ea17f1448
2823 files and 13840 vendor files
warning
/c/uploads/ has permissions 0755, but should have 0775
warning
/age/tmp/jobs/ has permissions 0700, but should have 0775
warning
/a*******ge/tmp/uploads/ has permissions 0700, but should have 0775
info
Full directory permission check is disabled
warning
You may experience problems when uploading a photo of large size or handling many/large albums. Take a look in the FAQ for details.
max_execution_time is set to 30
recommended is at least 200 seconds or 0 (no limit)
info
Have you considered supporting Lychee? :)
Info

Lychee Version (release): 7.5.4
DB Version: 7.5.4
Docker: lycheeorg-frankenphp
composer install: --no-dev
APP_ENV: production
APP_DEBUG: false
APP_URL: set
APP_DIR: default
LOG_VIEWER_ENABLED: false
System: Linux
PHP Version: 8.5.4
PHP User agent: Lychee/6 (https://lycheeorg.dev/)
Timezone: Pacific/Auckland
Max uploaded file size: 128M
Max post size: 128M
Chunk size: 102.40 MB
Max execution time: 30
MySQL Version: 11.8.7-MariaDB-ubu2404
exec() Available: yes
Imagick Available: 1
Imagick Enabled: yes
Imagick Version: 1809
GD Version: bundled (2.1.0 compatible)
Number of foreign key: 33 found.

Space
Configuration

version: 070504
check_for_updates: 0
sorting_photos_col: taken_at
sorting_photos_order: ASC
sorting_albums_col: max_taken_at
sorting_albums_order: ASC
imagick: 1
skip_duplicates: 0
small_max_width: 0
small_max_height: 360
medium_max_width: 1920
medium_max_height: 1080
lang: en
image_overlay_type: desc
default_license: none
compression_quality: 90
grants_full_photo_access: 0
delete_imported: 0
mod_frame_enabled: 1
mod_frame_refresh: 30
thumb_2x: 1
small_2x: 1
medium_2x: 0
landing_page_enable: 1
search_public: 0
hide_version_number: 0
recent_age: 1
grants_download: 0
photos_wraparound: 1
map_display: 0
zip64: 1
map_display_public: 0
map_provider: Wikimedia
map_include_subalbums: 0
update_check_every_days: 3
has_exiftool: 1
share_button_visible: 0
import_via_symlink: 0
has_ffmpeg: 1
location_decoding: 0
location_decoding_timeout: 30
location_show: 0
location_show_public: 0
rss_enable: 0
rss_recent_days: 7
rss_max_items: 100
prefer_available_xmp_metadata: 0
editor_enabled: 1
lossless_optimization: 0
local_takestamp_video_formats: .avi|.mov
log_max_num_line: 1000
unlock_password_photos_with_url_param: 0
nsfw_visible: 1
nsfw_blur: 0
nsfw_warning: 0
nsfw_warning_admin: 0
nsfw_banner_override:
map_display_direction: 0
album_subtitle_type: oldstyle
upload_processing_limit: 4
new_photos_notification: 0
zip_deflate_level: 6
default_album_protection: private
album_decoration: layers
album_decoration_orientation: row
allow_username_change: 1
auto_fix_orientation: 1
random_album_id: highlighted
use_last_modified_date_when_no_exif_date: 0
layout: justified
date_format_photo_thumb: M j, Y, g:i:s A e
date_format_photo_overlay: M j, Y, g:i:s A e
date_format_sidebar_uploaded: M j, Y, g:i:s A e
date_format_sidebar_taken_at: M j, Y, g:i:s A e
date_format_hero_min_max: F Y
date_format_hero_created_at: M j, Y, g:i:s A T
date_format_album_thumb: M Y
upload_chunk_size: 0
nsfw_banner_blur_backdrop: 0
search_pagination_limit: 300
search_minimum_length_required: 4
photo_layout_justified_row_height: 320
photo_layout_masonry_column_width: 300
photo_layout_grid_column_width: 250
photo_layout_square_column_width: 200
photo_layout_gap: 12
display_thumb_album_overlay: always
display_thumb_photo_overlay: hover
default_album_thumb_aspect_ratio: 1/1
use_album_compact_header: 0
back_button_enabled: 0
back_button_text: Return to Home
SA_random_thumbs: 0
login_required: 0
enable_unsorted: 0
enable_highlighted: 1
enable_recent: 1
enable_on_this_day: 1
login_required_root_only: 1
dark_mode_enabled: 1
low_quality_image_placeholder: 1
show_keybinding_help_popup: 1
show_keybinding_help_button: 1
disable_se_call_for_actions: 0
enable_se_preview: 0
slideshow_timeout: 3
keep_original_untouched: 1
timeline_photos_enabled: 1
timeline_photos_public: 0
timeline_photos_granularity: day
timeline_photos_order: taken_at
timeline_photos_layout: square
timeline_photos_pagination_limit: 200
timeline_albums_enabled: 1
timeline_albums_public: 0
timeline_albums_granularity: year
timeline_left_border_enabled: 1
timeline_photo_date_format_year: Y
timeline_photo_date_format_month: M Y
timeline_photo_date_format_day: j M Y
timeline_photo_date_format_hour: g:i
timeline_album_date_format_year: Y
timeline_album_date_format_month: M Y
timeline_album_date_format_day: j M
hide_nsfw_in_smart_albums: 1
hide_nsfw_in_frame: 1
hide_nsfw_in_map: 1
hide_nsfw_in_search: 1
search_photos_layout: square
hide_nsfw_in_rss: 1
hide_nsfw_in_timeline: 1
number_albums_per_row_mobile: 3
cache_enabled: 0
cache_ttl: 86400
low_number_of_shoots_per_day: 10
medium_number_of_shoots_per_day: 50
high_number_of_shoots_per_day: 100
maintenance_processing_limit: 5000
disable_recursive_permission_check: 1
exif_disabled_for_all: 0
file_name_hidden: 0
default_old_settings: 0
default_expert_settings: 0
default_all_settings: 0
client_side_favourite_enabled: 0
disable_thumb_download: 1
disable_thumb2x_download: 1
disable_small_download: 0
disable_small2x_download: 0
disable_medium_download: 0
disable_medium2x_download: 0
temporary_image_link_enabled: 0
temporary_image_link_when_logged_in: 0
temporary_image_link_when_admin: 0
temporary_image_link_life_in_seconds: 86400
secure_image_link_enabled: 0
SA_override_visibility: 0
TA_override_visibility: 0
enable_colour_extractions: 0
colour_extraction_driver: farzai
home_page_default: gallery
timeline_page_enabled: 1
timeline_quick_access_date_format_year: Y
timeline_quick_access_date_format_month: M
timeline_quick_access_date_format_day: j M
timeline_quick_access_date_format_hour: h M, g:i
flow_enabled: 1
flow_public: 1
flow_base:
flow_max_items: 10
flow_strategy: auto
flow_include_sub_albums: 0
flow_include_photos_from_children: 0
flow_open_album_on_click: 0
flow_display_open_album_button: 0
flow_highlight_first_picture: 1
flow_min_max_enabled: 1
flow_display_statistics: 1
flow_compact_mode_enabled: 1
flow_image_header_enabled: 1
flow_image_header_cover: cover
flow_image_header_height: 24
flow_carousel_enabled: 1
flow_carousel_height: 6
date_format_flow_published: M j, Y, g:i:s A e
date_format_flow_min_max: F Y
flow_blur_nsfw_enabled: 1
hide_nsfw_in_flow: 1
skip_duplicates_early: 1
sync_delete_missing_photos: 0
sync_delete_missing_albums: 0
sync_dry_run: 1
gallery_header_enabled: 0
gallery_header_logged_in_enabled: 0
gallery_header:
gallery_header_bar_transparent: 1
gallery_header_bar_gradient: 1
import_via_url_forbidden_localhost: 1
import_via_url_forbidden_local_ip: 1
import_via_url_require_https: 1
import_via_url_forbidden_ports: 1
details_links_enabled: 0
details_links_public: 0
is_scroll_to_navigate_photos_enabled: 1
is_swipe_vertically_to_go_back_enabled: 1
photo_thumb_tags_enabled: 0
hide_nsfw_in_tag_albums: 1
hide_nsfw_in_tag_listing: 1
sorting_pinned_albums_col: created_at
sorting_pinned_albums_order: DESC
copyright_text:
watermark_enabled: 0
watermark_photo_id:
watermark_public: 1
watermark_logged_in_users_enabled: 0
renamer_enabled: 0
renamer_enforced: 0
renamer_enforced_before: 0
renamer_enforced_after: 0
renamer_photo_title_enabled: 1
renamer_album_title_enabled: 1
extract_zip_on_upload: 1
webshop_currency: EUR
webshop_default_description: No description provided.
webshop_allow_guest_checkout: 1
webshop_terms_url:
webshop_privacy_url:
webshop_default_price_cents: 0
webshop_default_license: personal
webshop_default_size: medium
enable_untagged: 1
photos_pagination_limit: 500
deduplicate_pinned_albums: 0
desktop_dock_full_transparency_enabled: 0
mobile_dock_full_transparency_enabled: 0
import_via_url_block_redirect: 1
enable_smart_album_per_owner: 0
rating_enabled: 1
rating_public: 0
rating_show_only_when_user_rated: 0
rating_show_avg_in_details: 1
rating_photo_view_mode: hover
rating_show_avg_in_photo_view: 0
rating_album_view_mode: hover
rating_show_avg_in_album_view: 1
album_layout: grid
albums_per_page: 30
albums_pagination_ui_mode: infinite_scroll
albums_infinite_scroll_threshold: 10
photos_per_page: 100
photos_pagination_ui_mode: infinite_scroll
photos_infinite_scroll_threshold: 10
shared_albums_visibility_default: show
enable_unrated: 0
enable_1_star: 0
enable_2_stars: 0
enable_3_stars: 0
enable_4_stars: 1
enable_5_stars: 1
enable_best_pictures: 1
best_pictures_count: 100
enable_propagate_unlock_option: 0
enable_photo_details_always_open: 0
enable_my_rated_pictures: 1
enable_my_best_pictures: 1
my_best_pictures_count: 50
gps_coordinate_display: 0
gps_coordinate_display_public: 0
photos_star_visibility: editor
album_enhanced_display_enabled: 0
album_header_size: half_screen
album_header_landing_title_enabled: 0
watermark_optout_disabled: 0
raw_download_enabled: 0
contact_form_enabled: 0
contact_form_security_question:
contact_form_security_answer:
contact_form_custom_consent_required: 0
contact_form_custom_privacy_url:
contact_form_header:
contact_form_headline:
contact_form_contact_method:
contact_form_message_label:
contact_form_message_answer:
contact_form_custom_consent_text:
contact_form_custom_submit_button_text:
contact_form_thank_you_message:
landing_background_landscape_mode: static
landing_background_portrait_mode: static
search_colour_distance: 30

Browser & System [REQUIRED]

Tried in both Brave and Firefox browser's.
My system is Linux (Alpine), other docker containers run perfect ..

Please confirm (incomplete submissions will not be addressed)

• I have provided easy and step-by-step instructions to reproduce the bug.
• I understand my bug report will be removed if I haven't met the criteria above.
• I understand that if I am requested to provide more information, I must do so within 14 days or the bug report will be closed.

[bmentink]

@ildyria Sorry, the above probably should be in "Issues"
Here is what it looks like in Brave ..

[ildyria]

No worries.
Here is what you should see (I also use brave).

You can see what url it is trying to load for each image..

I then changed it to my domain as in: APP_URL: http://mydomain.com:8000/, which has the port forwarded.

If the port is forwarded from 443 to 8000, then you should have your APP_URL as https://mydomain.com the port 8000 is no longer necessary.
Note that if you see that it is trying to display your image with http instead of https, you can also set APP_FORCE_HTTPS to true.

As you are using docker compose, I would also encourage you to have a look at traefik. :)

Also please, for the love of god, rotate your APP_KEY. You just exposed it in the dump of your docker compose. :(

[bmentink]

Hi,
Thanks. The network tab in Firefox looks like this:

[bmentink]

and in brave:

[bmentink]

@ildyria Please how do I fix the 404's What changes do I make to the compose file .. thanks.
(Maybe the compose example on your web site needs updating if port 8000 is not used any more?)
I have another http web server running on http://192.168.1.54, that is why I used 8000 as external port for lychee, so I can access it as http://192.168.1.54:8000
I want to get that going before I do any fancy proxy work (I have ngnix proxy manager) not using 443 for now.

[bmentink]

I think the issue is the jpeg files I uploaded, maybe they were in 16bit and your site does not like them?
I uploaded some webp files and they are fine. Also png was fine.

[ildyria]

Any chance we can connect by email or our discord so I can have a look? That is very surprising to me.

[bmentink]

Any chance we can connect by email or our discord so I can have a look? That is very surprising to me.

Yes, no problem. I am in NZ so not sure what times overlap .. Discord suits