> ## Documentation Index
> Fetch the complete documentation index at: https://docs.kameleoon.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Selbst-Hosting der Anwendungsdatei mit Fastly CDN

> Hosten Sie die Kameleoon-Anwendungsdatei selbst auf Fastly CDN, um DNS-Latenz und SSL-Handshake-Overhead im Vergleich zur Verwendung des standardmaessigen Kameleoon-CDN zu reduzieren.

<Info>
  `kameleoon.js` ist veraltet und wurde in allen Kameleoon-Implementierungs-Snippets durch `engine.js` ersetzt. `kameleoon.js` wird nach dem **1. Juni 2026** nicht mehr unterstuetzt. Nach diesem Datum funktionieren alle Kampagnen auf Websites, die weiterhin auf `kameleoon.js` verweisen, nicht mehr. Aktualisieren Sie Ihr Implementierungs-Snippet entsprechend.
</Info>

## Fastly-Konfiguration

Melden Sie sich bei Ihrem Fastly-Konto an und erstellen Sie einen Origin-Host sowie zwei Content-Header wie folgt:

### Den Origin-Host erstellen

1. Navigieren Sie zur Registerkarte `Service configuration` und klicken Sie auf den linken Eintrag `Origins > Hosts`. Klicken Sie auf `Create host` und erstellen Sie eine neue Bedingung, um Ihre Kameleoon-Anwendungsdatei anzusprechen. Geben Sie ihr einen beschreibenden Namen wie **Kameleoon JavaScript Application File**.
2. Geben Sie im Feld Apply if folgende Bedingung an: `req.url ~ "^/kameleoon/engine.js"`
3. Speichern Sie Ihre neue Bedingung, um sie auf Ihren neuen Origin-Host anzuwenden.
4. Wenden Sie die folgenden Konfigurationsparameter auf Ihren Origin-Host an, wobei `YOUR_SITECODE` durch Ihre Kameleoon-Projekt-ID ersetzt wird (folgen Sie den in diesem [Artikel](/user-manual/faq#how-do-i-find-my-sitecode) beschriebenen Schritten, um sie abzurufen):

* **Name**: YOUR\_SITECODE.kameleoon.io
* **Address**: YOUR\_SITECODE.kameleoon.io
* **Certificate hostname**: YOUR\_SITECODE.kameleoon.io

<Frame>
  ![Konfiguration des Origin-Hosts](https://storage.googleapis.com/kameleoon-storage-documentation/developers/images/fastly-origin-host.png)
</Frame>

<Note>
  Hinweis: Die Domain fuer Ihre Kameleoon-Skripte kann von Projekt zu Projekt variieren. Ihre Projekte koennen je nach Erstellungsdatum entweder auf `kameleoon.eu` oder `kameleoon.io` gehostet werden. Stellen Sie sicher, dass Sie die in Ihrem Projekt in der Kameleoon App angezeigte Domain verwenden.
</Note>

### Die Header erstellen

Sie muessen Header erstellen, um anzugeben, wie der Inhalt Ihren Nutzern von Ihrer Website bereitgestellt werden soll:

1. Klicken Sie auf den linken Eintrag `Content > Headers`. Klicken Sie auf `Create a header`.
2. Haengen Sie dieselbe Bedingung an, die Sie fuer den Host erstellt haben, um die neue Kameleoon-JavaScript-Anwendungsdatei auf Ihrer Website anzusprechen.
3. Geben Sie Ihrem Header einen Namen (z. B. YOUR\_SITECODE.direct.kameleoon.io host) und stellen Sie sicher, dass er wie folgt konfiguriert ist, wobei `YOUR_SITECODE` durch Ihre Kameleoon-Projekt-ID ersetzt wird.

* **Type / Action**: Request - Set
* **Destination**: http.Host
* **Source**: "YOUR\_SITECODE.direct.kameleoon.io"

4. Klicken Sie auf Create, um Ihren Header zu speichern.

<Frame>
  \[![Konfiguration des Headers 1](https://storage.googleapis.com/kameleoon-storage-documentation/developers/images/fastly-header-1.png)
</Frame>

Bevor Sie Ihre neue Konfiguration aktivieren, muessen Sie einen zweiten Header erstellen, um die Basis der Anfrage zu aendern

1. Klicken Sie auf `Create a header`
2. Haengen Sie dieselbe Bedingung an, die Sie fuer den Host erstellt haben, um die neue Kameleoon-JavaScript-Anwendungsdatei auf Ihrer Website anzusprechen.
3. Geben Sie Ihrem Header einen Namen (z. B. YOUR\_SITECODE.direct.kameleoon.io base) und stellen Sie sicher, dass er wie folgt konfiguriert ist, wobei `YOUR_SITECODE` durch Ihre Kameleoon-Projekt-ID ersetzt wird.

* **Type / Action**: Request - Regex
* **Destination**: url
* **Source**: req.url
* **Regex**: ^/kameleoon/engine.js
* **Substitution**: /engine.js?uncompressed=true

4. Klicken Sie auf Create, um Ihren Header zu speichern.

<Frame>
  \[![Konfiguration des Headers 2](https://storage.googleapis.com/kameleoon-storage-documentation/developers/images/fastly-header-2.png)
</Frame>

### Kompressionsformat auswaehlen

Um die Kompression zu aktivieren, waehlen Sie zunaechst ein Kompressionsformat aus, indem Sie die folgenden Schritte ausfuehren:

1. Klicken Sie auf den linken Eintrag `Content`.
2. Scrollen Sie zum Bereich Compression. Die Kompressionssteuerungen erscheinen.
3. Waehlen Sie `Use Brotli compression when available`, um standardmaessig die Brotli-Kompression fuer Browser zu verwenden, die sie unterstuetzen.

<Frame>
  \[![Kompressionskonfiguration](https://storage.googleapis.com/kameleoon-storage-documentation/developers/images/fastly-compression.png)
</Frame>

<Note>
  Denken Sie daran, Ihre neue Fastly-Konfiguration zu aktivieren, damit sie wirksam wird, bevor Sie Ihren Quellcode aktualisieren.
</Note>

## Fuegen Sie das Kameleoon-Snippet in Ihren Quellcode ein

<Note>
  Lesen Sie diesen [Artikel](../implementation-and-deployment/standard-implementation), um zu verstehen, wie Sie Kameleoon auf Ihrer Website implementieren.
</Note>

Der letzte Schritt besteht darin, die Standard-JavaScript-URL der Kameleoon-Anwendung im Installations-Tag durch Ihre Fastly-URL zu ersetzen. Wenn Sie beispielsweise die Implementierungsmethode JavaScript-Datei ([Asynchrones Laden mit Anti-Flicker](../implementation-and-deployment/standard-implementation#asynchrones-tag-ohne-anti-flicker)) verwenden, wird die Kameleoon-Anwendungsdatei standardmaessig auf `//SITE_CODE.kameleoon.io/engine.js` gehostet. Sie muessen lediglich diese URL im Installations-Tag durch Ihre eigene Fastly-URL ersetzen.