IOS client cannot play video when connect through https domain about immich

[raisinbear]

That's interesting. I've been running behind nginx with Lets Encrypt since the very beginning. At the time, I just copied the relevant location parts from the by now obsolete reverse proxy container config, cf. below. Works flawlessly with (h264) videos in the iOS app. I can't see what else is going on in some of the included config files in your server block, but from what you posted, there is no drastic difference.

    location / {

      # Compression
      gzip_static on;
      gzip_min_length 1000;
      gzip_comp_level 2;

      proxy_buffering off;
      proxy_buffer_size 16k;
      proxy_busy_buffers_size 24k;
      proxy_buffers 64 4k;
      proxy_force_ranges on;

      proxy_http_version 1.1;
      proxy_set_header Host $host;
      proxy_set_header X-Real-IP $remote_addr;
      proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
      proxy_set_header X-Forwarded-Proto $scheme;
      proxy_set_header Upgrade $http_upgrade;
      proxy_set_header Connection "upgrade";
      proxy_set_header Host $host;

      proxy_pass http://127.0.0.1:2283;

      proxy_send_timeout 86400s;
      proxy_read_timeout 86400s;

      client_body_timeout 120s;
      keepalive_timeout 150s;
    }

[MFYDev]

@raisinbear I did my research, and here is what I found

Buffering Settings:

• Original Configuration: The original configuration did not specify any buffering settings. By default, Nginx enables proxy buffering, which can cause issues when streaming media content.

• New Configuration: The new configuration explicitly disables proxy buffering with proxy_buffering off; and sets various buffer sizes (proxy_buffer_size, proxy_busy_buffers_size, proxy_buffers). Disabling buffering allows Nginx to pass the data directly to the client as it arrives, which is crucial for streaming videos.

I think disabling buffering make the file can be passed through Nginx directly to the client and for video this is important. I tried to create a pr add the necessary config to the nginx reverse proxy part, but seems like Immich's docusaurus wiki is not a public repo.

Anyway thank you so much, this issue has been bothered me for month and finally!

[mmomjian]

Are you using a self-signed SSL cert?

[MFYDev]

Hi @mmomjian thank you for the fast response. I am using SSL Cert which I got from let's encrypt, so it is not a self-signed one

[alextran1502]

Do you mind posting your reverse proxy config?

[MFYDev]

Hi @alextran1502 Thank you for the response, here is my reverse proxy config

#PROXY-START/

location ^~ /
{
    client_max_body_size 50000M;
    proxy_pass http://127.0.0.1:2283;
    proxy_set_header Host $http_host;
    proxy_set_header X-Real-IP         $remote_addr;
    proxy_set_header X-Forwarded-For   $proxy_add_x_forwarded_for;
    proxy_set_header X-Forwarded-Proto $scheme;
    proxy_cache_convert_head off;

    # enable websockets: http://nginx.org/en/docs/http/websocket.html
    proxy_http_version 1.1;
    proxy_set_header   Upgrade    $http_upgrade;
    proxy_set_header   Connection "upgrade";
    proxy_redirect     off;

    # set timeout
    proxy_connect_timeout 300;
    proxy_send_timeout 300;
    proxy_read_timeout 300;
    send_timeout 300;

    
}

#PROXY-END/

[bo0tzz]

Can you include the SSL configuration please?

[alextran1502]

Can you try

client_max_body_size 0;

Restart your proxy and try again. Also, have you changed the default encoding settings? What are your video encoding options?

[mmomjian]

What is this setting for? proxy_cache_convert_head off;

[mmomjian]

Can you test using Safari on the same iOS device?

[MFYDev]

Hi @alextran1502 @mmomjian

Thanks again for the fast reply. I truly appreciate it.

I fistly set client_max_body_size 0;, still the same error in the IOS client, and I have never changed or even touched the settings related to video encoding.

And this below answer is from ChatGPT:

proxy_cache_convert_head off;: When this directive is set to off, responses to HEAD requests are cached separately from GET requests. This means that the HEAD and GET responses are stored independently in the cache, which can lead to slightly increased storage requirements but ensures that the cache contains accurate representations of both types of requests.

I tested on both Edge and Safari on my iPhone 14 Pro Max with the latest IOS 17, the browser can play the video without issues.

[mmomjian]

Yes, I looked up the meaning of the header, but I don't understand why you have set it that way. Are you caching replies? If so (I don't see this in your config), I would disable caching for testing. If you're not caching, you don't need the proxy_cache_convert_head and you should remove it for now since it's not part of our recommended config.

Also post the rest of your nginx config, specifically the listen, ssl_certificate, etc

[MFYDev]

Yes, I looked up the meaning of the header, but I don't understand why you have set it that way. Are you caching replies? If so (I don't see this in your config), I would disable caching for testing. If you're not caching, you don't need the proxy_cache_convert_head and you should remove it for now since it's not part of our recommended config.

@mmomjian soemtimes my nginx will cache a bit of the stuff from the website, so I added that, and sure I will remove that now.

Also post the rest of your nginx config, specifically the listen, ssl_certificate, etc

Here below is my full Nginx conf for the website

server
{
    listen 80;
		listen 443 ssl http2;
    server_name myimmichdomain;
    index index.php index.html index.htm default.php default.htm default.html;
    root /www/wwwroot/myimmichdomain;
    #CERT-APPLY-CHECK--START
    include /www/server/panel/vhost/nginx/well-known/myimmichdomain.conf;
    #CERT-APPLY-CHECK--END

    #error_page 404/404.html;
    #HTTP_TO_HTTPS_START
    if ($server_port !~ 443){
        rewrite ^(/.*)$ https://$host$1 permanent;
    }
    #HTTP_TO_HTTPS_END
    ssl_certificate    /www/server/panel/vhost/cert/myimmichdomain/fullchain.pem;
    ssl_certificate_key    /www/server/panel/vhost/cert/myimmichdomain/privkey.pem;
    ssl_protocols TLSv1.1 TLSv1.2 TLSv1.3;
    ssl_ciphers EECDH+CHACHA20:EECDH+CHACHA20-draft:EECDH+AES128:RSA+AES128:EECDH+AES256:RSA+AES256:EECDH+3DES:RSA+3DES:!MD5;
    ssl_prefer_server_ciphers on;
    ssl_session_cache shared:SSL:10m;
    ssl_session_timeout 10m;
    add_header Strict-Transport-Security "max-age=31536000";
    error_page 497  https://$host$request_uri;

    #SSL-END
        
    #ERROR-PAGE-START
    #error_page 404 /404.html;
    #error_page 502 /502.html;
    #ERROR-PAGE-END

    #PHP-INFO-START
    
	#reverse proxy
	include /www/server/panel/vhost/nginx/proxy/myimmichdomain/*.conf;

    #REWRITE-START 
    include /www/server/panel/vhost/rewrite/myimmichdomain.conf;
    #REWRITE-END


    location ~ \.well-known{
        allow all;
    }

    if ( $uri ~ "^/\.well-known/.*\.(php|jsp|py|js|css|lua|ts|go|zip|tar\.gz|rar|7z|sql|bak)$" ) {
        return 403;
    }

    access_log  /www/wwwlogs/myimmichdomain.log;
    error_log  /www/wwwlogs/myimmichdomain.error.log;
}

#PROXY-START/

location ^~ /
{
    client_max_body_size 0;
    proxy_pass http://127.0.0.1:2283;
    proxy_set_header Host $http_host;
    proxy_set_header X-Real-IP         $remote_addr;
    proxy_set_header X-Forwarded-For   $proxy_add_x_forwarded_for;
    proxy_set_header X-Forwarded-Proto $scheme;

    # enable websockets: http://nginx.org/en/docs/http/websocket.html
    proxy_http_version 1.1;
    proxy_set_header   Upgrade    $http_upgrade;
    proxy_set_header   Connection "upgrade";
    proxy_redirect     off;

    # set timeout
    proxy_connect_timeout 300;
    proxy_send_timeout 300;
    proxy_read_timeout 300;
    send_timeout 300;

    
}

#PROXY-END/

[MFYDev]

Can you include the SSL configuration please?

Hi @bo0tzz thank you for the response, I just uploaded all my nginx config here

[MFYDev]

I just tested again on all my devices, I have all the platforms, Windows and Android and Linux they are all working fine. IOS Safari and Edge browser can play the video, but if you pause the video, click back and re-click the video again, it will stuck there. IOS client cannot play video at all with that error log.

[MFYDev]

Another weird issue is that if I add any description to any photos or videos, IOS client will not sync the description. But this is a bit unrelated to this important issue tho.

[mmomjian]

(Since this work by direct IP, should probably be moved to a discussion IMO)

[MFYDev]

IMHO I do not think this should be moved to a discussion as we can see from all the platforms I tested; this issue is only happening on IOS client with that weird error log. All other platforms are all normal without issues. Which makes me doubt this is actually a bug.

I searched a long time in the immich issue list and immich discord helpdesk, and unfortunately, I got nothing. The weird part is if this is happening to me, it should be a very common issue, surprisingly very few people posted here.

[MFYDev]

Some similar issues in the discussion:

• #9038
• #4757

IOS is always weird, I can see the error log is a bit different now tho. I remember long time ago I replied in a discord helpdesk post as well, however due to the discord auto-hide after inactivity for a period of time, I cannot revisit that one again.

[MFYDev]

Just checked the Nginx access log, IOS client's api request got a 200 response, which means it's fully correct.

172.70.114.242 - - [02/Jul/2024:16:27:55 -0400] ＂GET /api/assets/21ba507a-cf89-4fa0-b4e6-df50987194c8/video/playback HTTP/2.0＂ 200 8388608 ＂-＂ ＂AppleCoreMedia/1.0.0.21F90 (iPhone; U; CPU OS 17_5_1 like Mac OS X; en_us)＂
172.70.230.4 - - [02/Jul/2024:16:42:19 -0400] ＂POST /api/auth/validateToken HTTP/2.0＂ 200 19 ＂-＂ ＂Dart/3.4 (dart:io)＂

I also set up a API Key and tested with using Postman, the response is also correct. I think till this point I can confirm it is definitely IOS client issue.

[Str1atum]

similar problem - I cannot play the videos on Safari Mac 17.5 since 1.107 update. Using traefik with Letsencrypt SSL. Worked fine previously and still works fine with Chrome.
File is accessible as I can download the recoded and original video with right click "save as"

[MFYDev]

gzip_static on;
gzip_min_length 1000;
gzip_comp_level 2;

  proxy_buffering off;
  proxy_buffer_size 16k;
  proxy_busy_buffers_size 24k;
  proxy_buffers 64 4k;
  proxy_force_ranges on;

  proxy_http_version 1.1;
  proxy_set_header Host $host;
  proxy_set_header X-Real-IP $remote_addr;
  proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
  proxy_set_header X-Forwarded-Proto $scheme;
  proxy_set_header Upgrade $http_upgrade;
  proxy_set_header Connection "upgrade";
  proxy_set_header Host $host;

  proxy_pass http://127.0.0.1:2283;

  proxy_send_timeout 86400s;
  proxy_read_timeout 86400s;

  client_body_timeout 120s;
  keepalive_timeout 150s;

HOLY JEEZ!!! THANK YOU SOOOOO MUCH!!!

I just tried your config for my proxy, basically just copy and paste and it is IMMEDIATELY WORKING!!!!

YOU ARE A LIFE SAVOR!!!

[raisinbear]

HOLY JEEZ!!! THANK YOU SOOOOO MUCH!!!

I just tried your config for my proxy, basically just copy and paste and it is IMMEDIATELY WORKING!!!!

YOU ARE A LIFE SAVOR!!!

Oh cool, very glad I could help! 😀 Still would be very interesting what went wrong before. Will do some experimentinf when I find time.

[mmomjian]

@raisinbear I did my research, and here is what I found

Buffering Settings:

• Original Configuration: The original configuration did not specify any buffering settings. By default, Nginx enables proxy buffering, which can cause issues when streaming media content.
• New Configuration: The new configuration explicitly disables proxy buffering with proxy_buffering off; and sets various buffer sizes (proxy_buffer_size, proxy_busy_buffers_size, proxy_buffers). Disabling buffering allows Nginx to pass the data directly to the client as it arrives, which is crucial for streaming videos.

I think disabling buffering make the file can be passed through Nginx directly to the client and for video this is important. I tried to create a pr add the necessary config to the nginx reverse proxy part, but seems like Immich's docusaurus wiki is not a public repo.

Anyway thank you so much, this issue has been bothered me for month and finally!

The docs are public. They’re found in the docs/docs folder.