[Feature]: Ability to pass custom headers via mobile apps

[pkosiec]

Feature detail

Hello there 👋
Firstly, I'd like to thank you for such an awesome project. It's incredible how fast it improves with brand-new features! 🚀

Context

I set up Immich on my NAS, and wanted to secure it with Cloudflare Zero Trust on a public hostname. That means, I want to have Immich accessible publicly, but behind another layer of authentication provided by Cloudflare. If user navigates to the public hostname, the user is redirected by Cloudflare to log in via SSO. Based on custom access rules defined in Cloudflare Dashboard, the user is able to access the app or not.

It works perfectly in the web browser, but it doesn't in a mobile app, as it cannot connect because of the redirection to the login form. However, Cloudflare allows generating Service tokens, which means that if a client provides two custom headers and will follow the redirection, it will authenticate the client and can access the original site (based on the access policies).

So, basically, this won't work:

curl -vL https://immich.example.com/api # fetches Cloudflare login site

But this will:

curl -H "CF-Access-Client-Id: ...." -H "CF-Access-Client-Secret: ..." -vL https://immich.example.com/api # returns the original 404 API response

Idea

An ability to set multiple custom headers as a part of the login screen to the mobile app. If I were able to set two custom headers from the login view, it would mean Cloudlfare Zero Trust and also other auth solutions can be used with the mobile app. Of course, the app would need to use them with each API request.

I imagine this could be implemented as a button/link (e.g. "Advanced") on the login view, which could open a modal with additional configuration options: additional headers and later something more (e.g. "Accept self-signed certificate"). Something like this:

I'd be happy to contribute, however I don't know Dart and that could be a problem for me to develop some advanced views 🤔 Any guidance is warmly welcome.

But first, let me know what do you think about this idea! Cheers!

Platform

Mobile App

[jrasm91]

Does it actually return the SSO login page for that url or does it send a redirect? Did this mean your have to sign in twice on the web?

[pkosiec]

@jrasm91 It sends a temporary redirect (302) - here's the output from curl:

* Connection state changed (MAX_CONCURRENT_STREAMS == 256)!
< HTTP/2 302
< date: Wed, 11 Jan 2023 21:14:42 GMT
< location: https://myaccount.cloudflareaccess.com/cdn-cgi/access/login/mydomain.com?kid=2...&redirect_url=%2Fapi&meta=eyJr...

So Cloudflare redirects to their page where you need to e.g. login with one-time PIN sent via email or custom OIDC providers like Google. The access rules are fully configurable on Cloudflare side.

When using service auth tokens, the 302 redirection doesn't occur.

curl -H "CF-Access-Client-Id: ..." -H "CF-Access-Client-Secret: ..." -v https://example.com/api # no -L, so it won't follow redirects

Response:

* Connection state changed (MAX_CONCURRENT_STREAMS == 256)!
< HTTP/2 404
# (...)
{"statusCode":404,"message":"Cannot GET /api","error":"Not Found"}

I know Immich has OIDC support, but I'd like to have a second layer of authentication with special access rules. Just to filter out the traffic, as this would be a publicly accessible instance with private data 🙂

Do you see a different solution to that?

[jrasm91]

Yeah, I don't think there is any easy/straightforward way to implement this. Is Immich the first self-hosted service with a mobile app? Or, the rest you just can't use either?

We could try to detect the redirect in the mobile app, follow it, and then include the cookies in future requests, but that isn't very easy or straightforward, plus it's so specific to this use case and provider.

Another option would definitely be to provide a place to manually add additional options for auth - headers, tokens, etc. This seems related to "proxy authentication" where the user delegates authentication to another system, which communicates directly with immich.

[pkosiec]

Yes, unfortunately other apps I self-host have web apps only, and that's the first case I wanted to connect from the mobile app.

Another option would definitely be to provide a place to manually add additional options for auth - headers, tokens, etc. This seems related to "proxy authentication" where the user delegates authentication to another system, which communicates directly with immich.

Yes, that sounds good. But I'm also thinking about some custom proxy which I could prepare for modifying requests from mobile app 🤔 Let's see if I'm the only one who wants to set up headers for API requests from mobile app. I'll also reach back when I'll find a workaround with a separate proxy.

Thanks for the ultra-fast reply!

[oblivioncth]

Also a new user of Cloudflared and Immich. It's frustrating that there isn't a more standard way to handle page redirects in apps as I'd ultimately prefer to use the Zero Trust auth to handle all of my authentication period, but the moment something dedicated app that goes out the window.

I mainly use the Google Account OIDC and since Immich has this anyway, I'm fine for now just having Zero Trust bypass for the subdomain and going to Immich directly with Google auth enabled there.

However, what's also nice about using Cloudflare for auth is that if you're using split-horizon DNS to access your services locally, then you just intrinsically bypass that layer. Not that it's a huge deal, but enabling OAuth2 through Immich will mean that it will be required even when I'm connecting from home.

It would be nice in the future if some elegant way was figured out to support this.

[mounte]

Just giving my +1 for this.
I think adding option for manual entry of extra headers should be a "straightforward" thing and could serve multiple purpose as well.

Ideally you would want to be able to identify such redirects and follow the flow but from a project plan and complexity I would opt for a simple stupid solution initially.

What about some interceptor like dio or other similar solution from this SO:
https://stackoverflow.com/questions/54321077/best-way-to-set-default-header-for-all-request-in-flutter-http-request
??

[Vandewaetere]

Another +1, loving the added protection layer of cloudflare, but it annoys me having to use a separate vpn for the app. Having the headers option would open up a lot of scenarios.

[Sammy1Am]

+1 for some kind of solution via Cloudflare (it's been great for all the other applications I'm hosting at home)

Is Immich the first self-hosted service with a mobile app? Or, the rest you just can't use either?

We could try to detect the redirect in the mobile app, follow it, and then include the cookies in future requests, but that isn't very easy or straightforward, plus it's so specific to this use case and provider.

Home Assistant, at least, does that. When I try to login it opens up an embedded browser window for me to login to Cloudflare. However, I don't know for sure, but I strongly suspect their app might just be a wrapper over an embedded browser anyway. So maybe not as complicated for them.

[Triple-Z]

I found that Swift paperless (paperless-ngx iOS app) has this functionality and it works well: paulgessinger/swift-paperless#11

Hopes immich would support it!

[SebboGit]

+1 from me too.
I don't want to use a Cloudflare Tunnel without any extra layer of security, but right now I don't see an easy way to do this. Making use of Cloudflare Servive Token would be great.