---
title: 'Configuration'
---

# Client Config Reference

The config for the movie-web can be provided in 2 different ways, depending on how you are hosting movie-web:

- If you are using a static web hoster (such as Vercel, Netlify or Cloudflare Pages), you can use [environment variables](#method-1-environment-variables).
- If you are hosting movie-web using shared hosting (such as cPanel or FTP), please use [the config file](#method-2-config-file).

Both methods can specify any of the keys listed in the [Shared Config](#config-reference-shared-config) section.

## Method 1 - Environment Variables

The movie-web client can be configured using environment variables **at build time**. You cannot use this method if hosting the pre-built `movie-web.zip` files!

Using environment variables to configure movie-web also allows configuration of some [environment variable specific keys](#config-reference-environment-variables-only).

## Method 2 - Config File

When using the pre-built `movie-web.zip`, you can set the configuration in the `config.js` file.

The `config.js` file contains a JavaScript object which must be set to the correct values:

```js
window.__CONFIG__ = {
  // ... Config variables go here ...
};
```

## Config Reference - Shared Config

### `VITE_TMDB_READ_API_KEY` ⚠

- Type: `string`
- Default: `""`

This is the **read** API key from TMDB to allow movie-web to search for media. [Get one by following our guide](/client/tmdb).

::alert{type="danger"}
**Required. The client will not work properly if this is not configured.**
::

### `VITE_CORS_PROXY_URL`

- Type: `string`
- Default: `""`
- Example: `"https://example1.example.com,https://example2.example.com"`

This is where you put proxy URLs. [Get some by following our guides](/proxy/deploy).

If left empty, the client onboarding will not provide a "default setup" and the user will have to manually configure their own proxy or use the extension.

You can add multiple Workers by separating them with a comma, they will be load balanced using round robin method on the client.
**Worker URL entries must not end with a slash.**

::alert{type="danger"}
**Required. The client will not work properly if this is not configured.**
::

### `VITE_DMCA_EMAIL`

- Type: `string`
- Default: `""`
- Example: `"dmca@example.com"`

This is the DMCA email for on the DMCA page. If this config value is present, a new page will be made and linked in the footer, where it will mention how to handle DMCA take-down requests. If the configuration value is left empty, the page will not exist.

### `VITE_NORMAL_ROUTER`

- Type: `boolean`
- Default: `false`

The application has two routing modes: hash-router and history-router.
Hash router means that every page is linked with a hash like so: <code style="overflow-wrap: anywhere">https://example.com/#/browse</code>.

History router does routing without a hash like so: `https://example.com/browse`, this looks a lot nicer, but it requires that your hosting environment supports Single-Page-Application (SPA) redirects (Vercel supports this feature). If you don't know what that means, don't enable this.

Setting this configuration value to `true` will enable the history-router.

### `VITE_BACKEND_URL`

- Type: `string`
- Default: `""`
- Example: `"https://backend.example.com"`

This is the URL for the movie-web backend server which handles cross-device syncing.

The backend server can be found at https://github.com/movie-web/backend and is offered as a [Docker](https://docs.docker.com/get-started/overview/){target="\_blank"} image for deployment.

Backend URL must **not** end with a slash.

### `VITE_HAS_ONBOARDING`

- Type: `boolean`
- Default: `true`

If you want your users to be prompted with an onboarding screen before they start watching, enable this.

### `VITE_ONBOARDING_CHROME_EXTENSION_INSTALL_LINK`

- Type: `string`
- Default: `"https://chromewebstore.google.com/detail/movie-web-extension/hoffoikpiofojilgpofjhnkkamfnnhmm"`
- Example: `"https://google.com"`

When onboarding is enabled using `VITE_HAS_ONBOARDING`. This link will be used to link the proper Chrome extension to install.

If omitted, this will still show the extension onboarding screen, just without an install link for the extension.

### `VITE_ONBOARDING_FIREFOX_EXTENSION_INSTALL_LINK`

- Type: `string`
- Default: `"https://addons.mozilla.org/en-GB/firefox/addon/movie-web-extension"`
- Example: `"https://google.com"`

When onboarding is enabled using `VITE_HAS_ONBOARDING`. This link will be used to link the proper Firefox extension to install.

If omitted, this will still show the extension onboarding screen, just without an install link for the extension.

### `VITE_ONBOARDING_PROXY_INSTALL_LINK`

- Type: `string`
- Default: `""`
- Example: `"https://google.com"`

When onboarding is enabled using `VITE_HAS_ONBOARDING`. This link will be used to link the user to resources to host a custom proxy.

If omitted, this will still show the proxy onboarding screen, just without an documentation link for the proxy.

### `VITE_DISALLOWED_IDS`

- Type: `string`
- Default: `""`
- Example: `"series-123,movie-456"`

In the unfortunate event that you've been sent a DMCA take down notice, you'll need to disable some pages. This configuration key will allow you to disable specific ids.

For shows, it needs to be in this format: `series-<TMDB_ID>`. For movies the format is this: `movie-<TMDB_ID>`.

The list is comma separated, you can add as many as needed.

### `VITE_CDN_REPLACEMENTS`

- Type: `string`
- Default: `""`
- Example: <code style="overflow-wrap: anywhere">"google.com:example.com,123movies.com:flixhq.to"</code>

Sometimes you want to proxy a CDN. This is how you can easily replace a CDN URL with your own.

The format is `<beforeA>:<afterA>,<beforeB>:<afterB>,...`

### `VITE_TURNSTILE_KEY`

- Type: `string`
- Default: `""`

The [Turnstile key](https://dash.cloudflare.com/sign-up?to=/:account/turnstile){target="\_blank"} for Cloudflare captchas. It's used to authenticate requests to proxy workers (or providers API).

[The proxy workers will need to be configured to accept these captcha tokens](../2.proxy/2.configuration.md#turnstile_secret), otherwise it has no effect for security.

## Config reference - Environment Variables Only

::alert{type="danger"}
:icon{name="material-symbols:warning-rounded"} These configuration keys are specific to environment variables, they **only** work as environment variables **set at build time**.
::

### `VITE_PWA_ENABLED`

- Type: `boolean`
- Default: `false`

Set to `true` if you want to output a PWA application. Set to `false` or omit to get a normal web application.
A PWA web application can be installed as an application to your phone or desktop computer, but can be tricky to manage and comes with a few footguns.

::alert{type="warning"}
Make sure you know what you're doing before enabling this, it **cannot be disabled** after you've set it up once.
::

### `VITE_GA_ID`

- Type: `string`
- Default: `""`
- Example: `"G-1234567890"`

The Google Analytics ID for tracking user behavior. If omitted, no tracking will be done.

### `VITE_APP_DOMAIN`

- Type: `string`
- Default: `""`
- Example: `"https://movie-web.app"`

The domain where the app lives. Only required when having the [`VITE_OPENSEARCH_ENABLED`](#vite_opensearch_enabled) option enabled.

The value must include the protocol (HTTP/HTTPS) but must **not** end with a slash.

### `VITE_OPENSEARCH_ENABLED`

- Type: `boolean`
- Default: `false`

Whether to enable [OpenSearch](https://developer.mozilla.org/en-US/docs/Web/OpenSearch){target="\_blank"}, this allows a user to add a search engine to their browser. When enabling you **must** also set [`VITE_APP_DOMAIN`](#vite_app_domain).

::alert{type="warning"}
:icon{name="material-symbols:warning-rounded"} This field is case sensitive, make sure you use the correct casing.
::
