Copy Image Error

[amirulasri]

The bug

Hello, I get this error when copying the image after using the next and previous button

https://github.com/user-attachments/assets/bc878a6f-94d8-47d4-bc92-b77aafa59dcc

The OS that Immich Server is running on

Ubuntu 24.04.1

Version of Immich Server

1.20.1

Version of Immich Mobile App

1.20.1

Platform with the issue

• [ ] Server
• [X] Web
• [ ] Mobile

Your docker-compose.yml content

#
# WARNING: Make sure to use the docker-compose.yml of the current release:
#
# https://github.com/immich-app/immich/releases/latest/download/docker-compose.yml
#
# The compose file on main may not be compatible with the latest release.
#

name: immich

services:
  immich-server:
    container_name: immich_server
    image: ghcr.io/immich-app/immich-server:${IMMICH_VERSION:-release}
    extends:
       file: hwaccel.transcoding.yml
       service: vaapi # set to one of [nvenc, quicksync, rkmpp, vaapi, vaapi-wsl] for accelerated transcoding
    volumes:
      # Do not edit the next line. If you want to change the media storage location on your system, edit the value of U>      - ${UPLOAD_LOCATION}:/usr/src/app/upload
      - /etc/localtime:/etc/localtime:ro
    env_file:
      - .env
    ports:
      - 2283:2283
    depends_on:
      - redis
      - database
    restart: always
    healthcheck:
      disable: false

  immich-machine-learning:
    container_name: immich_machine_learning
    # For hardware acceleration, add one of -[armnn, cuda, openvino] to the image tag.
    # Example tag: ${IMMICH_VERSION:-release}-cuda
    image: ghcr.io/immich-app/immich-machine-learning:${IMMICH_VERSION:-release}
    # extends: # uncomment this section for hardware acceleration - see https://immich.app/docs/features/ml-hardware-ac>    #   file: hwaccel.ml.yml
    #   service: cpu # set to one of [armnn, cuda, openvino, openvino-wsl] for accelerated inference - use the `-wsl` v>    volumes:
      - model-cache:/cache
    env_file:
      - .env
    restart: always
    healthcheck:
      disable: false

  redis:
    container_name: immich_redis
    image: docker.io/redis:6.2-alpine@sha256:e3b17ba9479deec4b7d1eeec1548a253acc5374d68d3b27937fcfe4df8d18c7e
    healthcheck:
      test: redis-cli ping || exit 1
    restart: always

  database:
    container_name: immich_postgres
    image: docker.io/tensorchord/pgvecto-rs:pg14-v0.2.0@sha256:90724186f0a3517cf6914295b5ab410db9ce23190a2d9d0b9dd6463e>    environment:
      POSTGRES_PASSWORD: ${DB_PASSWORD}
      POSTGRES_USER: ${DB_USERNAME}
      POSTGRES_DB: ${DB_DATABASE_NAME}
      POSTGRES_INITDB_ARGS: '--data-checksums'
    volumes:
      # Do not edit the next line. If you want to change the database storage location on your system, edit the value o>      - ${DB_DATA_LOCATION}:/var/lib/postgresql/data
    healthcheck:
      test: pg_isready --dbname='${DB_DATABASE_NAME}' --username='${DB_USERNAME}' || exit 1; Chksum="$$(psql --dbname='>      interval: 5m
      start_interval: 30s
      start_period: 5m
    command: ["postgres", "-c", "shared_preload_libraries=vectors.so", "-c", 'search_path="$$user", public, vectors', ">    restart: always

volumes:
  model-cache:

Your .env content

# You can find documentation for all the supported env variables at https://immich.app/docs/install/environment-variabl>
# The location where your uploaded files are stored
UPLOAD_LOCATION=/mnt/drive1/immichamirulasrimedia
# The location where your database files are stored
DB_DATA_LOCATION=./postgres

# To set a timezone, uncomment the next line and change Etc/UTC to a TZ identifier from this list: https://en.wikipedia># TZ=Etc/UTC

# The Immich version to use. You can pin this to a specific version like "v1.71.0"
IMMICH_VERSION=release

# Connection secret for postgres. You should change it to a random password
# Please use only the characters `A-Za-z0-9`, without special characters or spaces
DB_PASSWORD=*****

# The values below this line do not need to be changed
###################################################################################
DB_USERNAME=postgres
DB_DATABASE_NAME=immich

Reproduction steps

1. Open any image
2. Click next/previous twice (I mean click two times faster)
3. Copy Image

Relevant log output

Copy error NotAllowedError: Failed to execute 'write' on 'Clipboard': Type image/jpeg not supported on write. NotAllowedError: Failed to execute 'write' on 'Clipboard': Type image/jpeg not supported on write.
overrideMethod @ hook.js:608
E @ handle-error.BE4t3eYy.js:1
(anonymous) @ asset-viewer.hCBwUc6L.js:16
await in (anonymous)
click @ asset-viewer.hCBwUc6L.js:16
K @ misc.B_QYLVAD.js:1
(anonymous) @ circle-icon-button.DA2uEOpw.js:1
s @ store.Bw0dcTvY.js:1

Additional information

No response

[bo0tzz]

I managed to reproduce this on firefox and got an error message that I think hints to the cause: [handleError]: Copy error DOMException: Type 'image/jpeg' not supported for write <empty string> I suspect it isn't to do with browsing more than one image to the side, but rather with trying to copy quickly after opening an image in the viewer. I'm guessing it tries to copy the image before it's fully loaded (or maybe right while it's loading the higher resolution version. After triggering this bug on an asset it'll keep happening for that asset until the page is reloaded.

Sometimes the error message I get is instead [handleError]: Copy error DOMException: Type 'text/html; charset=utf-8' not supported for write <empty string>.

[danieldietzler]

There have recently been significant changes in this area and I personally cannot reproduce it anymore. If this is still an issue please let us know!

[bo0tzz]

I still manage to reproduce this (first try), although not when moving to the immediate next asset as there is preload applied there. Hitting Ctrl+C immediately after opening an asset from the timeline, or after quickly skipping multiple times in a row, still reproduces this.

[scottrbaxter]

First time trying to use this feature, I can 100% reproduce this issue with Safari (including as a Webapp). Seems fine with Brave Browser (Chromium), but Safari throws the red "Copy error" message every time i click the copy icon. No corresponding container logs while clicking the link.

I'm happy to troubleshoot and help track down the bug if need be.

[jrasm91]

The safari issue is a duplicate of #16148, which has been fixed. It looks like the code will take the image html element, write it to a canvas element as a png, and then copy it to the clipboard. When the image element isn't available it copies it via the asset url, but that doesn't support certain mime-types like jpeg, so it throws that error. I wonder if we should disable the copy button until the image element is present.