Go to file
Nils 7a9cc5c456 fix(loginV2): Disable image optimization (#10508)
<!--
Please inform yourself about the contribution guidelines on submitting a
PR here:
https://github.com/zitadel/zitadel/blob/main/CONTRIBUTING.md#submit-a-pull-request-pr.
Take note of how PR/commit titles should be written and replace the
template texts in the sections below. Don't remove any of the sections.
It is important that the commit history clearly shows what is changed
and why.
Important: By submitting a contribution you agree to the terms from our
Licensing Policy as described here:
https://github.com/zitadel/zitadel/blob/main/LICENSING.md#community-contributions.
-->

# Which Problems Are Solved

Next.js's Image Optimization feature requires that hostnames for remote
images be explicitly defined in the `next.config.js` file via
`remotePatterns`. This configuration is static and evaluated at **build
time**.

However, the `ZITADEL_API_URL`, which is supposed to be used for
additional whitelisted hostnames, is a dynamic environment variable only
known at **run time**. This creates a fundamental conflict, making it
impossible to add the user-provided URL to the configuration when
building the public Docker image. Consequently, images like instance
logos fail to load.

The existing workaround uses a permissive wildcard pattern
(`*.zitadel.*`). This is a significant security risk, as it could allow
malicious actors to abuse the server as an open image-resizing proxy,
leading to potential denial-of-service (DDoS) attacks or excessive
costs.

# How the Problems Are Solved

This change disables the Next.js Image Optimization feature entirely by
setting `unoptimized: true` in the `images` configuration.

By doing this, Next.js will no longer attempt to optimize, cache, or
validate remote image sources. Instead, it will pass the original image
URL directly to the client. This approach resolves the issue by:

1. **Eliminating the need for `remotePatterns`**, which bypasses the
build-time vs. run-time configuration conflict.
2. **Improving security** by removing the overly permissive wildcard
pattern.
3.  **Ensuring functionality**, as remote images now load correctly.

The trade-off is the loss of performance benefits from Next.js image
optimization, but I see this as an acceptable compromise to restore
essential functionality and secure the application.


Fixes #10456

Co-authored-by: Max Peintner <max@caos.ch>
2025-08-25 13:53:21 +00:00
2025-08-19 15:22:34 +02:00
2023-07-17 10:08:20 +02:00
2025-08-19 15:22:34 +02:00
2024-07-26 22:39:55 +02:00
2021-02-08 16:48:41 +01:00
2025-08-19 15:22:34 +02:00
2025-04-02 16:53:06 +02:00
2025-08-14 15:17:20 +00:00

Zitadel Logo Zitadel Logo

GitHub Workflow Status (with event) GitHub contributors

Are you searching for a user management tool that is quickly set up like Auth0 and open source like Keycloak?

Do you have a project that requires multi-tenant user management with self-service for your customers?

Look no further — ZITADEL is the identity infrastructure, simplified for you.

We provide you with a wide range of out-of-the-box features to accelerate your project, including:

Multi-tenancy with team management
Secure login
Self-service
OpenID Connect
OAuth2.x
SAML2
LDAP
Passkeys / FIDO2
OTP
SCIM 2.0 Server and an unlimited audit trail is there for you, ready to use.

With ZITADEL, you are assured of a robust and customizable turnkey solution for all your authentication and authorization needs.


🏡 Website 💬 Chat 📋 Docs 🧑‍💻 Blog 📞 Contact

Get started

👉 Quick Start Guide

Deploy ZITADEL (Self-Hosted)

Deploying ZITADEL locally takes less than 3 minutes. Go ahead and give it a try!

See all guides here

If you are interested to get professional support for your self-hosted ZITADEL please reach out to us!

Setup ZITADEL Cloud (SaaS)

If you want to experience a hands-free ZITADEL, you should use ZITADEL Cloud. Available data regions are:

  • 🇺🇸 United States
  • 🇪🇺 European Union
  • 🇦🇺 Australia
  • 🇨🇭 Switzerland

ZITADEL Cloud comes with a free tier, providing you with all the same features as the open-source version. Learn more about the pay-as-you-go pricing.

Adopters

We are grateful to the organizations and individuals who are using ZITADEL. If you are using ZITADEL, please consider adding your name to our Adopters list by submitting a pull request.

Example applications

Clone one of our example applications or deploy them directly to Vercel.

SDKs

Use our SDKs for your favorite language and framework.

Why choose ZITADEL

We built ZITADEL with a complex multi-tenancy architecture in mind and provide the best solution to handle B2B customers and partners. Yet it offers everything you need for a customer identity (CIAM) use case.

Features

Authentication

Multi-Tenancy

Integration

Self-Service

Deployment

Track upcoming features on our roadmap and follow our changelog for recent updates.

How To Contribute

Find details about how you can contribute in our Contribution Guide. Join our Discord Chat to get help.

Contributors

Made with contrib.rocks.

Showcase

Quick Start Guide

Secure a React Application using OpenID Connect Authorization Code with PKCE

Quick Start Guide

Login with Passkeys

Use our login widget to allow easy and secure access to your applications and enjoy all the benefits of Passkeys (FIDO 2 / WebAuthN):

Passkeys

Admin Console

Use Console or our APIs to setup organizations, projects and applications.

Console Showcase

Login V2

Check out our new Login V2 version in our typescript repository or in our documentation New Login Showcase

Security

You can find our security policy here.

Technical Advisories are published regarding major issues with the ZITADEL platform that could potentially impact security or stability in production environments.

License

here are our exact licensing terms.

Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See our license for detailed information governing permissions and limitations on use.

Languages
Go 82.6%
TypeScript 10.3%
HTML 4.2%
SCSS 2%
CSS 0.6%
Other 0.1%