Initial draft

This commit is contained in:
qtchaos 2023-12-31 16:39:55 +02:00
parent baf2169306
commit 86cd905dc8
No known key found for this signature in database
GPG Key ID: 7DA98B2B9EF06A90
40 changed files with 2461 additions and 2909 deletions

7
.editorconfig Normal file
View File

@ -0,0 +1,7 @@
root = true
[*]
end_of_line = lf
insert_final_newline = true
indent_size = 2
indent_style = space

View File

@ -1,4 +1,7 @@
dist dist
node_modules node_modules
.output .output
.nuxt .nuxt
public
# Ignore index due to prettier removing setext headers
*.index.md

View File

@ -1,8 +1,8 @@
module.exports = { module.exports = {
root: true, root: true,
extends: '@nuxt/eslint-config', extends: ['@nuxt/eslint-config', 'plugin:prettier/recommended'],
rules: { rules: {
'vue/max-attributes-per-line': 'off', 'vue/max-attributes-per-line': 'off',
'vue/multi-word-component-names': 'off' 'vue/multi-word-component-names': 'off',
} },
} };

1
.gitattributes vendored Normal file
View File

@ -0,0 +1 @@
* text=auto eol=lf

View File

@ -1 +1 @@
Please visit the [main document at primary repository](https://github.com/movie-web/movie-web/blob/dev/.github/CODE_OF_CONDUCT.md). Please visit the [main document at primary repository](https://github.com/movie-web/movie-web/blob/dev/.github/CODE_OF_CONDUCT.md).

View File

@ -1 +1 @@
Please visit the [main document at primary repository](https://github.com/movie-web/movie-web/blob/dev/.github/CONTRIBUTING.md). Please visit the [main document at primary repository](https://github.com/movie-web/movie-web/blob/dev/.github/CONTRIBUTING.md).

4
.prettierrc Normal file
View File

@ -0,0 +1,4 @@
{
"trailingComma": "all",
"singleQuote": true
}

View File

@ -1,18 +1,41 @@
export default defineAppConfig({ export default defineAppConfig({
docus: { docus: {
title: 'movie-web', title: 'movie-web',
description: 'Hosting documentation for movie-web', description:
'movie-web is a free and open source streaming site, no ads, no tracking, no nonsense.',
url: 'https://docs.movie-web.app',
image: '/cover.png',
socials: { socials: {
github: 'movie-web/movie-web', github: 'movie-web/movie-web',
}, },
image: '', github: {
repo: 'docs',
owner: 'movie-web',
branch: 'master',
dir: 'content',
edit: true,
},
aside: { aside: {
level: 0, level: 0,
exclude: [], exclude: [],
}, },
header: { header: {
logo: false, logo: true,
title: "movie-web" },
footer: {
credits: {
icon: '',
text: 'Made with 💜',
href: 'https://github.com/movie-web',
},
textLinks: [
{
text: 'movie-web',
href: 'https://movie-web.app',
target: '_blank',
rel: 'noopener',
},
],
}, },
}, },
}); });

3
components/Logo.vue Normal file
View File

@ -0,0 +1,3 @@
<template>
<img src="/icon.png" alt="Logo of movie-web" />
</template>

View File

@ -1,24 +1,27 @@
--- ---
title: "movie-web | For all your movie and TV show needs" title: 'movie-web - For all your movie and TV show needs'
navigation: false navigation: false
head.titleTemplate: ''
layout: page layout: page
--- ---
::block-hero ::block-hero
--- ---
cta: cta:
- Get Started - Get Started
- /self-hosting/hosting-intro - /self-hosting/hosting-intro
secondary: secondary:
- Open on GitHub → - Open on GitHub →
- https://github.com/movie-web/movie-web - https://github.com/movie-web/movie-web
--- ---
#title #title
movie-web movie-web
#description #description
A simple and no-BS app for watching movies and TV shows A simple and no-BS app for watching movies and TV shows. :br
Totally free and open source, forever.
:: ::
::card-grid ::card-grid
@ -29,22 +32,66 @@ What's all the fuss?
:ellipsis :ellipsis
#default #default
::card{icon="mdi:server-network"} ::card{icon="mdi:server-network"}
#title #title
Easy to host Easy to host
#description #description
movie-web can be easily hosted on any static website host. Can be easily hosted on any static website host.
:: ::
::card{icon="material-symbols:hangout-video-off"} ::card{icon="material-symbols:hangout-video-off"}
#title #title
No ADs No ADs
#description #description
movie-web will never show ADs, enjoy watching without interruptions. movie-web will never show ADs, enjoy watching without interruptions.
:: ::
::card{icon="ic:baseline-ondemand-video"} ::card{icon="ic:baseline-ondemand-video"}
#title #title
Custom Player Custom Player
#description #description
Enjoy a fully custom video player including streaming integration, subtitle customisation and easy TV season navigation. Enjoy a fully custom video player including streaming integration, subtitle customisation and easy TV season navigation.
:: ::
::card{icon="mdi:content-save"}
#title
Saves your progress
#description
Will remember your progress in movies and TV shows, so you can easily continue where you left off.
::
::card{icon="mdi:bookmark"}
#title
Bookmarking
#description
Allows you to bookmark your favourite movies and TV shows, so you can easily find them again.
::
::card{icon="mdi:cloud-refresh"}
#title
Syncing across devices
#description
We support syncing your progress, proxies and bookmarks across devices, so you can easily continue where you left off.
::
::card{icon="mdi:power-plug-outline"}
#title
Modular by design
#description
Mix and match different parts of the movie-web service, [host your backend](4.backend/1.deploy.md) or use ours, it'll work either way.
##
::
::card{icon="mdi:flag"}
#title
Multiple Languages
#description
Supports over 25 languages, including English, German, French, Spanish, Italian, Czech, Hindi, Arabic, Hebrew and more. View the full list on [weblate](https://weblate.movie-web.app){target="\_blank"}.
::
::card{icon="mdi:brush-variant"}
#title
Customisable
#description
Supports custom themes, subtitle colors and sizes so you can make it look however you want.
::
::card{icon="mdi:cellphone"}
#title
PWA Support
#description
Supports PWA, so you can install it on your phone and use it just like a native app.
:: ::

View File

@ -1,33 +1,36 @@
--- ---
title: 'Start self-hosting' title: 'Start self-hosting'
--- ---
# How to self host # How to self host
::alert{type="info"} ::alert{type="info"}
We **do not** provide support on how to self-host. If you can't figure it out then tough luck. Please do not make GitHub issues or ask in our Discord server for support on how to self-host. We **do not** provide support on how to self-host. If you can't figure it out then tough luck. Please do not make GitHub issues or ask in our Discord server for support on how to self-host.
:: ::
There are a few configurations of hosting movie-web. Each with their own benefits. Since movie-web has many different components, there are a few configurations of how you can host it. Each of these configurations has their own benefits, whether that be having complete control over your data or customizing your experience.
**If you don't know what to choose, go with method 1.** **If you don't know what to choose, go with [method 1.](#method-1---only-host-the-frontend)**
## Method 1 - Only host the frontend ## Method 1 - Only host the frontend
With this method, you only host the essential parts that make movie-web work. But keep using the account server from offical movie-web.
With this method, you only host the essential parts that make movie-web work. But keep using the account server from official movie-web.
This method is the easiest to self-host and is recommended for most users. This method is the easiest to self-host and is recommended for most users.
1. [Setup the Proxy!](../2.proxy/1.deploy.md) 1. [Set up the Proxy!](../2.proxy/1.deploy.md)
2. [Setup the Client!](../3.client/1.deploy.md) 2. [Set up the Client!](../3.client/1.deploy.md)
## Method 2 - Only host the account server ## Method 2 - Only host the account server
If you want to own your own data, it's possible to selfhost just the account server and nothing else. If you want to own your own data, it's possible to selfhost just the account server and nothing else.
This method is only recommended if you have experience hosting databases or other similar stateful applications. This method is only recommended if you have experience hosting databases or other similar stateful applications.
1. [Setup the Backend!](../4.backend/1.deploy.md) 1. [Set up the Backend!](../4.backend/1.deploy.md)
2. [Configure the Client!](../3.client/1.deploy.md) 2. [Configure the Client!](../3.client/1.deploy.md)
## Method 3 - Host everything ## Method 3 - Host everything
If you want an instance that's completely isolated from official movie-web. You can selfhost all parts.
This method is not recommended for inexperienced hosters.
1. [Setup the Proxy!](../2.proxy/1.deploy.md) If you want an instance that's completely isolated from the official movie-web. You can selfhost all of the parts yourself, though this method is not recommended for inexperienced hosters.
2. [Setup the Backend!](../4.backend/1.deploy.md)
3. [Setup the Client!](../3.client/1.deploy.md) 1. [Set up the Proxy!](../2.proxy/1.deploy.md)
2. [Set up the Backend!](../4.backend/1.deploy.md)
3. [Set up the Client!](../3.client/1.deploy.md)

View File

@ -1,15 +1,16 @@
--- ---
title: 'Configure backend' title: 'Configure backend'
--- ---
# Configure your client with the backend # Configure your client with the backend
If you would like to use an alternative backend server (The server responsible for saving user data across devices) then you can specify your own URL **without needing to host your own movie-web frontend!** If you would like to use an alternative backend server (the server responsible for saving user data across devices) then you can specify your own URL **without needing to host your own movie-web frontend!**
::alert{type="danger"} ::alert{type="danger"}
Changing your backend server will log you out of your account - make sure you have a copy of your 12-word passphrase saved safely in case you need to go back! Changing your backend server will log you out of your account - make sure you have a copy of your 12-word passphrase saved safely in case you need to go back!
:: ::
1. On movie-web, got to your settings page by click the menu icon at the top right and then `Settings`. 1. On movie-web, got to your settings page by click the menu icon at the top right and then `Settings`.
1. Scroll down the page to the section named `Connections` where there is a toggle named `Custom server`. 1. Scroll down the page to the section named `Connections` where there is a toggle named `Custom server`.
1. Enable the `Custom server` toggle and enter your backend URL in the input box named `Custom server URL`. 1. Enable the `Custom server` toggle and enter your backend URL in the input box named `Custom server URL`.
1. Click `Save` at the bottom right corner of your screen. 1. Click `Save` at the bottom right corner of your screen.

View File

@ -1,6 +1,7 @@
--- ---
title: 'PWA vs no-PWA' title: 'PWA vs no-PWA'
--- ---
# About Selfhosting PWA # About Selfhosting PWA
So that clients can have a more native app-like experience on mobile, movie-web has a function to support Progessive Web Apps (PWA). You can learn more about what a PWA is [here](https://developer.mozilla.org/en-US/docs/Web/Progressive_web_apps/Guides/What_is_a_progressive_web_app). So that clients can have a more native app-like experience on mobile, movie-web has a function to support Progessive Web Apps (PWA). You can learn more about what a PWA is [here](https://developer.mozilla.org/en-US/docs/Web/Progressive_web_apps/Guides/What_is_a_progressive_web_app).
@ -12,9 +13,11 @@ Enabling PWAs means that you cannot disable it again - Please only proceed if yo
:: ::
## If you are running movie-web on a hoster such as Vercel ## If you are running movie-web on a hoster such as Vercel
If your hosting is building movie-web from the source, you can enable PWAs using environment variables. The full environment variable reference can be found [here](../3.client/3.configuration.md) but for PWAs we are only interested in `VITE_PWA_ENABLED`.
Setting `VITE_PWA_ENABLED` to `true` will generate a [service worker file](https://developer.mozilla.org/en-US/docs/Web/Progressive_web_apps/Guides/Making_PWAs_installable#service_worker) and a [web app manifest](https://developer.mozilla.org/en-US/docs/Web/Progressive_web_apps/Guides/Making_PWAs_installable#the_web_app_manifest) which enable the website to be installed from a [web browser both on Desktop and on Mobile](https://developer.mozilla.org/en-US/docs/Web/Progressive_web_apps/Guides/Making_PWAs_installable#installation_from_the_web). If your hosting is building movie-web from the source, you can enable PWAs using environment variables. The full environment variable reference can be found [here](../3.client/3.configuration.md) but for PWAs we are only interested in `VITE_PWA_ENABLED`.
Setting [`VITE_PWA_ENABLED`](../3.client/3.configuration.md#vite_pwa_enabled) to `true` will generate a [service worker file](https://developer.mozilla.org/en-US/docs/Web/Progressive_web_apps/Guides/Making_PWAs_installable#service_worker) and a [web app manifest](https://developer.mozilla.org/en-US/docs/Web/Progressive_web_apps/Guides/Making_PWAs_installable#the_web_app_manifest) which enable the website to be installed from a [web browser both on Desktop and on Mobile](https://developer.mozilla.org/en-US/docs/Web/Progressive_web_apps/Guides/Making_PWAs_installable#installation_from_the_web).
## If you are running movie-web using the .zip files ## If you are running movie-web using the .zip files
If you are downloading the movie-web `zip` files from our GitHub and installing them on a static website hoster, then all you need to do is to make sure to download the [`movie-web.pwa.zip`](https://github.com/movie-web/movie-web/releases/latest/download/movie-web.pwa.zip) file instead of the `movie-web.zip` file!
If you are downloading the movie-web `zip` files from our GitHub and installing them on a static website hoster, then all you need to do is to make sure to download the [`movie-web.pwa.zip`](https://github.com/movie-web/movie-web/releases/latest/download/movie-web.pwa.zip) file instead of the `movie-web.zip` file!

View File

@ -1,10 +1,10 @@
--- ---
title: 'Troubleshooting' title: 'Troubleshooting'
--- ---
# Troubleshooting # Troubleshooting
There is a possibility for something to go wrong while trying to deploy your own instance of movie-web. This page will contain common issues people come across while self-hosting and their solutions. There is always a possibility for something to go wrong while trying to deploy your own instance of movie-web. This page will contain common issues people come across while self-hosting and their solutions.
## "Failed to find media, try again!" while searching ## "Failed to find media, try again!" while searching
@ -14,7 +14,6 @@ If it succeeds, the TMDB api key is correct and it will be a different issue.
If it does not work. Recheck your TMDB api key. **Make sure its the READ api key, not the normal api key.** If it does not work. Recheck your TMDB api key. **Make sure its the READ api key, not the normal api key.**
## Everything I try to watch fails ## Everything I try to watch fails
This is likely a misconfigured worker. Verify that the workers are the issue by going to `/admin` or `/#/admin`. Then clicking `Test workers`. This is likely a misconfigured worker. Verify that the workers are the issue by going to `/admin` or `/#/admin`. Then clicking `Test workers`.
@ -23,7 +22,6 @@ You should have at least 1 worker registered.
If any worker fails the test, you should double check its URL and double check if the worker has the correct code. If any worker fails the test, you should double check its URL and double check if the worker has the correct code.
## I can't make an account or login ## I can't make an account or login
This is likely misconfigured or broken backend. Verify the backend by going to `/admin` or `/#/admin`. Then clicking `Test backend`. This is likely misconfigured or broken backend. Verify the backend by going to `/admin` or `/#/admin`. Then clicking `Test backend`.
@ -36,7 +34,14 @@ If the version is not the latest version, you should update your backend instanc
If the name and description of the results don't match your own instance, make sure you have your backend URL set correctly. If the name and description of the results don't match your own instance, make sure you have your backend URL set correctly.
## I updated from version 3 to version 4 but still see the old version ## I updated from version 3 to version 4 but still see the old version
This is likely that you haven't installed the PWA version of movie-web. Please read the [upgrade guide](../3.client/5.upgrade.md) It is likely that you haven't installed the PWA version of movie-web. Please read the [upgrade guide](../3.client/5.upgrade.md) for more details on the matter.
## I'm getting SSL issues when using a hosted postgres database
You are most likely missing the `postgres.ssl` variable on your backend, enable it and the connection should work.
## Permission denied to set parameter "session_replication_role"
Set the `MIKRO_ORM_MIGRATIONS_DISABLE_FOREIGN_KEYS` option to `false` in either your `.env` or your Docker command.

View File

@ -1,3 +1,3 @@
title: 'Self-Hosting' title: 'Self-Hosting'
icon: mdi:server-network icon: mdi:server-network
navigation.redirect: /self-hosting/hosting-intro navigation.redirect: /self-hosting/hosting-intro

View File

@ -1,7 +1,9 @@
--- ---
title: 'Introduction' title: 'Introduction'
--- ---
# Introduction to the proxy # Introduction to the proxy
Our proxy is used to bypass CORS-protected URLs on the client side, allowing users to make requests to CORS protected endpoints without a backend server. Our proxy is used to bypass CORS-protected URLs on the client side, allowing users to make requests to CORS protected endpoints without a backend server.
The proxy is made using [Nitro by UnJS](https://nitro.unjs.io/) which supports building the proxy to work on multiple providers including Cloudflare Workers, AWS Lambda and [more...](https://nitro.unjs.io/deploy) The proxy is made using [Nitro by UnJS](https://nitro.unjs.io/) which supports building the proxy to work on multiple providers including Cloudflare Workers, AWS Lambda and [more...](https://nitro.unjs.io/deploy)

View File

@ -1,54 +1,56 @@
--- ---
title: 'Deploy' title: 'Deploy'
--- ---
# Deploying the proxy # Deploying the proxy
## Method 1 - Cloudflare (Easy) ## Method 1 - Cloudflare (Easy)
Cloudflare has a generous free plan, so you don't need to pay anything unless you get hundreds of users. Cloudflare has a generous free plan, so you don't need to pay anything unless you get hundreds of users.
[![Deploy to Cloudflare Workers](https://deploy.workers.cloudflare.com/button)](https://deploy.workers.cloudflare.com/?url=https://github.com/movie-web/simple-proxy) [![Deploy to Cloudflare Workers](https://deploy.workers.cloudflare.com/button)](https://deploy.workers.cloudflare.com/?url=https://github.com/movie-web/simple-proxy){target="\_blank"}
1. Create a GitHub account at https://github.com if you don't have one. 1. Create a GitHub account at https://github.com if you don't have one.
1. Click the `Deploy with workers` button above. 1. Click the `Deploy with workers` button above.
1. Click the `Authorize Workers` button to authorise Cloudflare to talk to GitHub. 1. Click the `Authorize Workers` button to authorise Cloudflare to talk to GitHub.
1. Authorize Cloudflare Workers in the GitHub page that pops up. 1. Authorize Cloudflare Workers in the GitHub page that pops up.
1. Follow the instructions to configure your Cloudflare account. Select `I have an account` if you have a Cloudflare account already, otherwise follow the link to create one. 1. Follow the instructions to configure your Cloudflare account. Select `I have an account` if you have a Cloudflare account already, otherwise follow the link to create one.
1. Click the link to `Workers Dashboard` to find your account ID. 1. Click the link to [`Workers Dashboard`](https://dash.cloudflare.com/sign-up?to=/:account/workers-and-pages){target="\_blank"} to find your account ID.
1. You can copy your account ID from the URL e.g. https://dash.cloudflare.com/ab7cb454c93987b6343350d4e84c16c7/workers-and-pages/create where `ab7cb454c93987b6343350d4e84c16c7` is the account ID. 1. You can copy your account ID from the URL e.g. https://dash.cloudflare.com/ab7cb454c93987b6343350d4e84c16c7/workers-and-pages/create where `ab7cb454c93987b6343350d4e84c16c7` is the account ID.
1. Paste the account ID into the text box on the original Cloudflare workers page. 1. Paste the account ID into the text box on the original Cloudflare workers page.
1. Click the link to `My Profile` to create an API token. 1. Click the link to [`My Profile`](https://dash.cloudflare.com/profile/api-tokens){target="\_blank"}, to create an API token.
1. Click `Create Token`. 1. Click `Create Token`.
1. Select `Use template` next to `Edit Cloudflare Workers`. 1. Select `Use template` next to `Edit Cloudflare Workers`.
1. Under `Account Resources`, select `Include` and your account under the dropdown. 1. Under `Account Resources`, select `Include` and your account under the dropdown.
1. Under `Zone Resources`, select `All zones` (You can select a more specific zone if you have the zones available). 1. Under `Zone Resources`, select `All zones` (You can select a more specific zone if you have the zones available).
1. At the bottom of the page, click `Continue to summary`. 1. At the bottom of the page, click `Continue to summary`.
1. On the next screen, click `Create token`. 1. On the next screen, click `Create token`.
1. Copy the API token and **save it in a safe place, it won't be shown again**. 1. Copy the API token and **save it in a safe place, it won't be shown again**.
1. Paste the API token into the Cloudflare Workers API Token text box. 1. Paste the API token into the Cloudflare Workers API Token text box.
1. Click `Fork the Repository` and follow the instructions to enable workflows. 1. Click `Fork the Repository` and follow the instructions to enable workflows.
1. Click `Deploy` to deploy to Cloudflare Workers. 1. Click `Deploy` to deploy to Cloudflare Workers.
1. Congratulations! Your worker is now deploying. Please wait for the GitHub Action to build and publish your worker. 1. Congratulations! Your worker is now deploying. Please wait for the GitHub Action to build and publish your worker.
1. You can click the `Worker dash` and `GitHub repo` buttons to see the status of the deploy. 1. You can click the [`Worker dash`](https://dash.cloudflare.com/sign-up?to=/:account/workers-and-pages){target="\_blank"} and `GitHub repo` buttons to see the status of the deploy.
1. When the worker has deployed, you will need to take note of the URL. This can be found on Cloudflare under Workers and Pages -> Overview -> Proxy. 1. When the worker has deployed, you will need to take note of the URL. This can be found on Cloudflare under [Workers and Pages -> Overview](https://dash.cloudflare.com/sign-up?to=/:account/workers-and-pages){target="\_blank"} -> Proxy.
## Method 1 - Cloudflare (Manual) ## Method 1 - Cloudflare (Manual)
1. Login to your Cloudflare account if you have one, otherwise create one [here](https://dash.cloudflare.com/sign-up)
1. If you are signing up for an account, make sure to verify your email before going further! 1. Login to your Cloudflare account if you have one, otherwise create one [here](https://dash.cloudflare.com/sign-up?to=/:account/workers-and-pages)
1. If you are signing up for an account, make sure to verify your email before going further!
1. Download the latest version of the Cloudflare [`simple-proxy-cloudflare.mjs` script from here](https://github.com/movie-web/simple-proxy/releases/latest/download/simple-proxy-cloudflare.mjs). 1. Download the latest version of the Cloudflare [`simple-proxy-cloudflare.mjs` script from here](https://github.com/movie-web/simple-proxy/releases/latest/download/simple-proxy-cloudflare.mjs).
1. Go to `Workers & Pages` and then `Overview` in the left-hand navigation bar. 1. Go to `Workers & Pages` and then `Overview` in the left-hand navigation bar.
1. Click the `Create Worker` button 1. Click the `Create Worker` button
1. If you've made a worker or pages application before, you will need to click `Create Application` first 1. If you've made a worker or pages application before, you will need to click `Create Application` first
1. Give your worker a name and click `Deploy`. This can be anything you would like! 1. Give your worker a name and click `Deploy`. This can be anything you would like!
1. On the `Congratulations` web page, click the `Edit code` button to edit the code in the worker you have just created. 1. On the `Congratulations` web page, click the `Edit code` button to edit the code in the worker you have just created.
1. There should now be a code editor on the left hand side on the web page. 1. There should now be a code editor on the left hand side on the web page.
1. Select all of the existing template code and delete it. **You must make sure all of the code is deleted for this to work!** 1. Select all of the existing template code and delete it. **You must make sure all of the code is deleted for this to work!**
1. Go to your downloads folder and open up the `simple-proxy-cloudflare.mjs` file you downloaded earlier in a text editor, and **copy** the contents. 1. Go to your downloads folder and open up the `simple-proxy-cloudflare.mjs` file you downloaded earlier in a text editor, and **copy** the contents.
1. Back in your browser, paste the contents of the file into the code editor. 1. Back in your browser, paste the contents of the file into the code editor.
1. The `Save and deploy` button in the top right corner should now be active, click it to deploy your proxy! 1. The `Save and deploy` button in the top right corner should now be active, click it to deploy your proxy!
1. A confirmation dialog will appear, click `Save and deploy` once more. 1. A confirmation dialog will appear, click `Save and deploy` once more.
1. Your worker is now deployed! You can click the back button in the top left to take you back to the summary screen. 1. Your worker is now deployed! You can click the back button in the top left to take you back to the summary screen.
1. On the summary screen, your worker link will be displayed under `Preview`. Right click the link, click `Copy link address` and save the link somewhere - you will need it to setup the client! 1. On the summary screen, your worker link will be displayed under `Preview`. Right click the link, click `Copy link address` and save the link somewhere - you will need it to set up the client!
## Method 2 - Docker ## Method 2 - Docker
@ -57,8 +59,8 @@ Experience with Docker, domains and web hosting is **highly recommended** for th
[Deploying with Cloudflare](#method-1-cloudflare-easy) is easier and safer to do! You are exposing your server at your own risk! [Deploying with Cloudflare](#method-1-cloudflare-easy) is easier and safer to do! You are exposing your server at your own risk!
:: ::
Our `simple-proxy` application is available from the GitHub Container Registry under the image `ghcr.io/movie-web/simple-proxy:latest` :copy-button{content="ghcr.io/movie-web/simple-proxy:latest"} Our `simple-proxy` application is available from the GitHub Container Registry under the image [`ghcr.io/movie-web/simple-proxy:latest`](https://ghcr.io/movie-web/simple-proxy:latest){target="\_blank"} :copy-button{content="ghcr.io/movie-web/simple-proxy:latest"}
The container exposes the HTTP port (Without TLS/SSL) as `3000/TCP`. The container exposes the HTTP port (Without TLS/SSL) as `3000/TCP`.
If you know what you are doing, you should know what to do with this information. If you don't, then please follow our Cloudflare guides. If you know what you are doing, you should know what to do with this information. If you don't, then please follow our Cloudflare guides.

View File

@ -1,16 +1,26 @@
--- ---
title: 'Configuration' title: 'Configuration'
--- ---
# Proxy Config Reference # Proxy Config Reference
The environment variables for the proxy is different to adjust per platform. So we will only be listed the variables themselves, it's your job to figure out to apply them to your platform. Adding environment variables is different for every platform, [here's a guide on how to add environment variables on Cloudflare](https://developers.cloudflare.com/workers/configuration/environment-variables/#add-environment-variables-via-the-dashboard). You'll have to do some research on your own if you aren't hosting the proxy on Cloudflare.
# Reference # Reference
### `TURNSTILE_SECRET` ### `TURNSTILE_SECRET`
Turnstile secret key from the cloudflare dashboard. To enable turnstile completely you will also need `JWT_SECRET` configured.
If you want turnstile verification working correctly, you will also need to configure the turnstile key on the client, not just on the proxy. - Type: `string`
- Default: `""`
Turnstile secret key from the [Cloudflare dashboard](https://dash.cloudflare.com/sign-up?to=/:account/turnstile).
::alert{type="warning"}
Keep in mind that you will also need to [configure the Turnstile key on the client](../3.client/3.configuration.md#vite_turnstile_key) and **configure the [`JWT_SECRET`](#jwt_secret) below.**
::
### `JWT_SECRET` ### `JWT_SECRET`
A jwt secret key. **Must be 32 characters long.** Can be any random secret.
- Type: `string`
- Default: `""`
A [JWT](https://jwt.io/) secret key. This can be any random secret, but **must be 32 characters long.**

View File

@ -1,15 +1,17 @@
--- ---
title: 'Changelog' title: 'Changelog'
--- ---
# Version 2.1.0 # Version 2.1.0
- Added turnstile integration to secure your workers from abuse. - Added turnstile integration to secure your workers from abuse.
# Version 2.0.1 # Version 2.0.1
- bugfix where sometimes body would double read - bugfix where sometimes body would double read
- bugfix where sometimes no response would be given at all due to race condition - bugfix where sometimes no response would be given at all due to race condition
# Version 2.0.0 # Version 2.0.0
- full rewrite, now supports multiple platforms: nodejs, cloudflare, aws lambda
- standard proxy headers are no longer sent through. Which now doesn't send a client ip through anymore. - full rewrite, now supports multiple platforms: nodejs, cloudflare, aws lambda
- standard proxy headers are no longer sent through. Which now doesn't send a client ip through anymore.

View File

@ -1,3 +1,3 @@
title: 'Proxy' title: 'Proxy'
icon: mdi:server-network icon: mdi:connection
navigation.redirect: /proxy/introduction navigation.redirect: /proxy/introduction

View File

@ -1,16 +1,17 @@
--- ---
title: 'Introduction' title: 'Introduction'
--- ---
# Introduction to the client # Introduction to the client
The client is what the main part of the application, it houses the interface and all of the scraping logic. The client is what users sees when navigating to your domain, it's the main part of the application and houses the interface and all of the scraping logic.
## PWA ## Progressive Web App
The client can be optionally ran as a PWA. This can be hard to do correctly and really hard to reverse, so it's generally not recommended to do so if you don't have experience hosting PWA's. The client can be optionally ran as a [PWA](https://web.dev/explore/progressive-web-apps), which allows it to be installed on a mobile device. This can be hard to do correctly and really hard to reverse, so it's generally not recommended to do so if you don't have experience hosting PWAs. If you understand the risks and still want to continue, then read more about it [here](../1.self-hosting/3.about-pwa.md).
You can read more about it [here](../1.self-hosting/3.about-pwa.md).
## Configuration ## Configuration
The client has a decent amount of configuration options. You can view them all [here](./3.configuration.md). The client features various configuration options, some of which are required for the client to function. [If you are using Vercel to host the client](1.deploy.md#method-1-vercel-recommended), then the required variables are a necessary part of creating the site, if you're using another host, or hosting it for yourself, you'll need to set them up yourself.
You can view all of the configuration options on the [configurations page](3.configuration.md).

View File

@ -1,37 +1,45 @@
--- ---
title: 'Deploy' title: 'Deploy'
--- ---
# Deploying the client # Deploying the client
## Method 1 - Vercel - Recommended ## Method 1 - Vercel - Recommended
[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Fmovie-web%2Fmovie-web%2Ftree%2Fmaster&env=VITE_CORS_PROXY_URL,VITE_TMDB_READ_API_KEY) [![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Fmovie-web%2Fmovie-web%2Ftree%2Fmaster&env=VITE_CORS_PROXY_URL,VITE_TMDB_READ_API_KEY)
1. Click the Deploy button. 1. Click the Deploy button.
1. Sign in using either a GitHub, GitLab, or Bitbucket. 1. Sign in using either a GitHub, GitLab, or Bitbucket.
1. Follow the instructions to create a repository for movie-web. 1. Follow the instructions to create a repository for movie-web.
1. Configure the environment variables: 1. Configure the environment variables:
- `VITE_CORS_PROXY_URL`: Enter your proxy URL here. Make sure to not have a slash at the end of your URL. - `VITE_CORS_PROXY_URL`: Enter your proxy URL here. Make sure to not have a slash at the end of your URL.
Example (THIS IS AN EXAMPLE, IT WON'T WORK FOR YOU): `https://test-proxy.test.workers.dev` Example (THIS IS AN EXAMPLE, IT WON'T WORK FOR YOU): `https://test-proxy.test.workers.dev`
- `VITE_TMDB_READ_API_KEY`: Enter your TMDB Read Access Token here. Please read [the TMDB page](2.tmdb.md) on how to get an API key. - `VITE_TMDB_READ_API_KEY`: Enter your TMDB Read Access Token here. Please read [the TMDB page](2.tmdb.md) on how to get an API key.
- `VITE_BACKEND_URL`: Only set if you have a self-hosted backend. Put in your backend URL. Check out [configuration reference](../4.client/2.configuration.md) for details. Make sure to not have a slash at the end of the URL. - `VITE_BACKEND_URL`: Only set if you have a self-hosted backend. Put in your backend URL. Check out [configuration reference](../4.client/2.configuration.md) for details. Make sure to not have a slash at the end of the URL.
1. Click "Deploy" 1. Click "Deploy"
1. Congrats! You have your own version of movie-web hosted. 1. Congrats! You have your own version of movie-web hosted.
1. You may wish to configure a custom domain - Please consult [the Vercel docs for how to do this](https://vercel.com/docs/getting-started-with-vercel/domains). 1. You may wish to configure a custom domain - Please consult [the Vercel docs for how to do this](https://vercel.com/docs/getting-started-with-vercel/domains).
## Method 2 - Static Web Host ## Method 2 - Static Web Host
1. Download the file `movie-web.zip` from the latest release: https://github.com/movie-web/movie-web/releases/latest. 1. Download the file `movie-web.zip` from the latest release: https://github.com/movie-web/movie-web/releases/latest.
2. Extract the ZIP file so you can edit the files. 2. Extract the ZIP file so you can edit the files.
3. Open `config.js` in an editor such as Notepad, Visual Studio Code or similar. 3. Open `config.js` in an editor such as Notepad, Visual Studio Code or similar.
4. Put your proxy URL in-between the double quotes of `VITE_CORS_PROXY_URL: ""`. Make sure to not have a slash at the end of your URL. 4. Put your proxy URL in-between the double quotes of `VITE_CORS_PROXY_URL: ""`. Make sure to not have a slash at the end of your URL.
Example (THIS IS AN EXAMPLE, IT WON'T WORK FOR YOU): `VITE_CORS_PROXY_URL: "https://test-proxy.test.workers.dev"` Example (THIS IS AN EXAMPLE, IT WON'T WORK FOR YOU): `VITE_CORS_PROXY_URL: "https://test-proxy.test.workers.dev"`
5. Put your TMDB Read Access Token inside the quotes of `VITE_TMDB_READ_API_KEY: ""`. Please read [the TMDB page](2.tmdb.md) on how to get an API key. 5. Put your TMDB Read Access Token inside the quotes of `VITE_TMDB_READ_API_KEY: ""`. Please read [the TMDB page](2.tmdb.md) on how to get an API key.
6. If you have a self-hosted backend server, enter your URL in the `VITE_BACKEND_URL` variable. Check out [configuration reference](../4.client/2.configuration.md) for details. Make sure to not have a slash at the end of the URL. 6. If you have a self-hosted backend server, enter your URL in the `VITE_BACKEND_URL` variable. Check out [configuration reference](../4.client/2.configuration.md) for details. Make sure to not have a slash at the end of the URL.
6. Save the file. 7. Save the file.
7. Upload **all** of the files to a static website hosting such as: 8. Upload **all** of the files to a static website hosting such as:
- GitHub Pages - GitHub Pages
- Netlify - Netlify
- Vercel - Vercel
- Etc, there are lots - Google it if the ones above don't work for you. - Etc, [there are lots of options](https://www.staticwebsitehosting.org/){target="\_blank"}.
1. Congrats! You have your own version of movie-web hosted. 9. Congrats! You have your own version of movie-web hosted.

View File

@ -3,6 +3,7 @@ title: 'TMDB API Key'
--- ---
## Getting an API Key ## Getting an API Key
In order to search for movies and TV shows, we use an API called "The Movie Database" (TMDB). In order for your client to be able to search, you need to generate an API key. In order to search for movies and TV shows, we use an API called "The Movie Database" (TMDB). In order for your client to be able to search, you need to generate an API key.
::alert{type="info"} ::alert{type="info"}
@ -14,6 +15,6 @@ The API key is **free**, you just need to create an account.
1. Go to https://www.themoviedb.org/settings/api/request to create a developer account. 1. Go to https://www.themoviedb.org/settings/api/request to create a developer account.
1. Read the terms and conditions and accept them. 1. Read the terms and conditions and accept them.
1. Fill out your details: 1. Fill out your details:
- Select "Website" as type of use. - Select "Website" as type of use.
- For the other details can put any values; they are not important. - For the other details can put any values; they are not important.
1. Copy the "API Read Access Token" - **DO NOT COPY THE API Key - IT WILL NOT WORK** 1. Copy the "API Read Access Token" - **DO NOT COPY THE API Key - IT WILL NOT WORK**

View File

@ -1,23 +1,28 @@
--- ---
title: 'Configuration' title: 'Configuration'
--- ---
# Client Config Reference # Client Config Reference
The config for the movie-web can be provided in 2 different ways, depending on how you are hosting movie-web: 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). - 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. Both methods can specify any of the keys listed in the [Shared Config](#config-reference-shared-config) section.
## Method 1 - Environment Variables ## 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! 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). 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 ## Method 2 - Config File
When using the pre-built `movie-web.zip`, you can set the configuration in the `config.js` 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: The `config.js` file contains a JavaScript object which must be set to the correct values:
```js ```js
window.__CONFIG__ = { window.__CONFIG__ = {
// ... Config variables go here ... // ... Config variables go here ...
@ -26,121 +31,132 @@ window.__CONFIG__ = {
## Config Reference - Shared Config ## Config Reference - Shared Config
### `VITE_TMDB_READ_API_KEY` - REQUIRED ### `VITE_TMDB_READ_API_KEY`
This is the **read** API key from TMDB to allow movie-web to search for media. [Get one by following our guide](/self-hosting/client#tmdb-api-key). This is the **read** API key from TMDB to allow movie-web to search for media. [Get one by following our guide](../3.client/2.tmdb.md#getting-an-api-key).
::alert{type="warning"} ::alert{type="danger"}
:icon{name="material-symbols:warning-rounded"} The example will not work for you, get your own **Required. The client will not work properly if this is not configured.**
:: ::
Example: <code style="overflow-wrap: anywhere">VITE_TMDB_READ_API_KEY=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0NTY3ODkwIiwibmFtZSI6IkpvaG4gRG9lIiwiaWF0IjoxNTE2MjM5MDIyfQ.SflKxwRJSMeKKF2QT4fwpMeJf36POk6yJV_adQssw5c</code>
### `VITE_CORS_PROXY_URL` - REQUIRED Example: `get-your-own-api-key`
This is where you put proxy URLS, you must have at least one. [Get one by following our guide](/self-hosting/proxy#cloudflare-workers). Default: N/A
You can add multiple workers by separating them by a comma, they will be load balanced using round robin method on the client. ### `VITE_CORS_PROXY_URL`
Worker url entries must **not** end with a slash. This is where you put proxy URLS, you must have at least one. [Get one by following our guide](../2.proxy/1.deploy.md#method-1---cloudflare-easy).
::alert{type="warning"} You can add multiple Workers by separating them with a comma, they will be load balanced using round robin method on the client.
:icon{name="material-symbols:warning-rounded"} The example will not work for you, get your own **Worker URL entries must not end with a slash.**
::alert{type="danger"}
**Required. The client will not work properly if this is not configured.**
:: ::
Example: `VITE_CORS_PROXY_URL=https://worker1.workers.dev,https://worker2.workers.dev`
Example: `"https://example1.example.com,https://example2.example.com"`
Default: N/A
### `VITE_DMCA_EMAIL` ### `VITE_DMCA_EMAIL`
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 left empty, the page will not exist. 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.
Example: `VITE_DMCA_EMAIL=dmca@example.com` Example: `"dmca@example.com"`
Default: `""` Default: `""`
### `VITE_NORMAL_ROUTER` ### `VITE_NORMAL_ROUTER`
The application has two routing modes: hash-router and history-router. The application has two routing modes: hash-router and history-router.
Hash router is that every page is linked in the hash like so: `https://example.com/#/browse`. Hash router means that every page is linked with a hash like so: `https://example.com/#/browse`.
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. If you don't know what that means, don't enable this. 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. Setting this configuration value to `true` will enable the history-router.
Example: `VITE_NORMAL_ROUTER=true` Example: `true`
Default: `false` Default: `false`
### `VITE_BACKEND_URL` ### `VITE_BACKEND_URL`
- Type: `string`
- Default: `"https://backend.movie-web.app"`
- Example: `"https://backend.example.com"`
This is the URL for the movie-web backend server which handles cross-device syncing. 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/) image for deployment. 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. Backend URL must **not** end with a slash.
Example: `VITE_BACKEND_URL=https://backend.example.com`
Default: `https://backend.movie-web.app`
### `VITE_DISALLOWED_IDS` ### `VITE_DISALLOWED_IDS`
In the unfortunate event that you're been sent a DMCA take down notice. You will need to somehow disable some pages. This configuration key will allow you to disable specific 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>`. 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. The list is comma separated, you can add as many as needed.
Example: `VITE_DISALLOWED_IDS=series-123,movie-456`
Default: `""`
### `VITE_CDN_REPLACEMENTS` ### `VITE_CDN_REPLACEMENTS`
Sometimes you want to proxy a CDN. This is how you can easily replace a cdn url with your own. - Type: `string`
- Default: `""`
- Example: `"google.com:exampe.com,123movies.com:flixhq.to"`
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>,...` The format is `<beforeA>:<afterA>,<beforeB>:<afterB>,...`
Example: `VITE_CDN_REPLACEMENTS=google.com:exampe.com,123movies.com:flixhq.to`
Default: `""`
### `VITE_TURNSTILE_KEY` ### `VITE_TURNSTILE_KEY`
The turnstile key for cloudflare captchas. It's used to authenticate request to proxy workers (or providers api). - Type: `string`
- Default: `""`
The proxy workers will need to be configured to accept these captcha tokens, otherwise it has no effect for security. 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).
Example: `""` [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 ## Config reference - Environment Variables Only
::alert{type="danger"} ::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**. :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` ### `VITE_PWA_ENABLED`
**This key can only be configured through environment variables.**
- 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. 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. 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.
Make sure you know what you're doing before enabling this, it **cannot be disabled** after you've set it up once.
Example: `VITE_PWA_ENABLED=no` ::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_APP_DOMAIN` ### `VITE_APP_DOMAIN`
**This key can only be configured through environment variables.**
The domain where the app lives. Only required when having OpenSearch enabled. - Type: `string`
- Default: `""`
- Example: `"https://movie-web.app"`
The value must include the protocol (http/https) but must **not** end with a slash. The domain where the app lives. Only required when having the [`VITE_OPENSEARCH_ENABLED`](#vite_opensearch_enabled) option enabled.
Example: `VITE_APP_DOMAIN=https://movie-web.app` The value must include the protocol (HTTP/HTTPS) but must **not** end with a slash.
### `VITE_OPENSEARCH_ENABLED` ### `VITE_OPENSEARCH_ENABLED`
**This key can only be configured through environment variables.**
Whether to enable OpenSearch. (the feature that allows a user to add a search engine to their browser). A - Type: `boolean`
when enabling you **must** also set `VITE_APP_DOMAIN`. - Default: `false`
`VITE_OPENSEARCH_ENABLED` must be set to `true` to be enabled. Anything else will be treated as turned off, it's case sensitive so `True` will also be disabled. 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).
Example: `VITE_OPENSEARCH_ENABLED=true`
::alert{type="warning"}
:icon{name="material-symbols:warning-rounded"} This field is case sensitive, make sure you use the correct casing.
::

View File

@ -3,43 +3,48 @@ title: 'Changelog'
--- ---
# Version 4.1.3 # Version 4.1.3
- Add support for downloading HLS playlists
- Added cdn replacements configuration option - Add support for downloading HLS playlists
- new translations: estonian, toki pona, spanish - Added cdn replacements configuration option
- Translation improvements: german, turkish, nepali, chinese - new translations: estonian, toki pona, spanish
- Translation improvements: german, turkish, nepali, chinese
# Version 4.1.2 # Version 4.1.2
- Improve bundle chunking
- Add millionjs for faster react - Improve bundle chunking
- Update all dependency versions - Add millionjs for faster react
- Translation improvements: czech, hebrew, german - Update all dependency versions
- Fix mobile controls not going away after some time - Translation improvements: czech, hebrew, german
- Improve poster quality - Fix mobile controls not going away after some time
- Fix "media not found" error not being shown - Improve poster quality
- Add more information to the error details modal - Fix "media not found" error not being shown
- Add more information to the error details modal
# Version 4.1.1 # Version 4.1.1
- Fixed bug where settings toggles sometimes weren't usuable
- Fixed bug where captions were permanently enabled - Fixed bug where settings toggles sometimes weren't usuable
- Fixed some missing translations - Fixed bug where captions were permanently enabled
- Translation improvements: arabic, french, nepali, chinese - Fixed some missing translations
- Translation improvements: arabic, french, nepali, chinese
# Version 4.1.0 # Version 4.1.0
- Added new translations: arabic, chinese, latvian, thai, nepali, dutch
- Translation improvements: turkish, hebrew - Added new translations: arabic, chinese, latvian, thai, nepali, dutch
- Fixed text directions for captions - Translation improvements: turkish, hebrew
- Anti-tamper script has been removed and replaced with turnstile (this is the devtools blocked, you can use devtools again) - Fixed text directions for captions
- Added way to add the providers-api instead of proxies - Anti-tamper script has been removed and replaced with turnstile (this is the devtools blocked, you can use devtools again)
- Added way to add the providers-api instead of proxies
# Version 4.0.2 # Version 4.0.2
- Added new translations: Hebrew, French, German, Swedish, Turkish.
- Added minion joke language. Blame @jip_. - Added new translations: Hebrew, French, German, Swedish, Turkish.
- Thumbnail preview no longer goes under the next episode button. - Added minion joke language. Blame @jip\_.
- Passphrase inputs are now actual password fields, so they may act nicer with password managers. - Thumbnail preview no longer goes under the next episode button.
- The player now remembers what your subtitle settings were, so no longer you need to keep selecting english everytime you watch. - Passphrase inputs are now actual password fields, so they may act nicer with password managers.
- Fix home link not working with /s/:term shortcut. - The player now remembers what your subtitle settings were, so no longer you need to keep selecting english everytime you watch.
- Swedish flag is now an actual Swedish flag. - Fix home link not working with /s/:term shortcut.
- Fix for various layout issues with small width mobile screens. - Swedish flag is now an actual Swedish flag.
- Fix for various layout issues with small width mobile screens.
# Version 4.0.0 # Version 4.0.0
@ -48,11 +53,13 @@ If you are upgrading from a previous version, make sure to read [the upgrade gui
:: ::
### Bug fixes ### Bug fixes
- Fixed bug where video player overlays the controls on IOS. - Fixed bug where video player overlays the controls on IOS.
- Fixed bug where you are kicked out of the fullscreen when switching episode. - Fixed bug where you are kicked out of the fullscreen when switching episode.
- Fixed bug where you cannot select a different episode if first episode fails to load. - Fixed bug where you cannot select a different episode if first episode fails to load.
### Enhancements ### Enhancements
- Completely redesigned look and feel for the entire website. - Completely redesigned look and feel for the entire website.
- Added FAQ and DMCA pages. - Added FAQ and DMCA pages.
- Source loading page is more detailed. - Source loading page is more detailed.
@ -65,6 +72,7 @@ If you are upgrading from a previous version, make sure to read [the upgrade gui
- Chromecasting now supports HLS - Chromecasting now supports HLS
### New features ### New features
- Quality selector! You can now switch qualities. - Quality selector! You can now switch qualities.
- Search bar no longer requires you to choose between shows or movies. - Search bar no longer requires you to choose between shows or movies.
- Visit `/s/:term` to quickly watch something. For example `https://movie-web.app/s/hamilton`. - Visit `/s/:term` to quickly watch something. For example `https://movie-web.app/s/hamilton`.

View File

@ -1,6 +1,7 @@
--- ---
title: 'Upgrade guide' title: 'Upgrade guide'
--- ---
# Upgrade guide # Upgrade guide
## From `3.X` to `4.X` ## From `3.X` to `4.X`

View File

@ -1,3 +1,3 @@
title: 'Client' title: 'Client'
icon: mdi:server-network icon: mdi:monitor
navigation.redirect: /client/introduction navigation.redirect: /client/introduction

View File

@ -1,22 +1,25 @@
--- ---
title: 'Introduction' title: 'Introduction'
--- ---
# Introduction to the backend # Introduction to the backend
The backend is essentially just an account server. There is not much more to it. The backend is essentially just an account server, there is not much more to it. The client will work fine without it, but no syncing options will be available.
## Metrics ## Metrics
The backend exposes prometheus metrics, it can be accessed on `/metrics`. The backend exposes an endpoint for [Prometheus metrics](https://prometheus.io/){target="\_blank"} which allows you to keep track of the backend more easily, it can be accessed on `/metrics`.
To view these metrics properly, you'll need to use an analytics program like [Grafana](https://grafana.com/){target="\_blank"}, [which can visualize logs from Prometheus](https://prometheus.io/docs/visualization/grafana/){target="\_blank"}.
## Security ## Security
Optionally, there are a few security settings: Optionally, there are a few security settings:
- Recaptcha support, the server can verify Recaptcha v3 tokens on register and login.
- Ratelimits, Some expensive endpoints have ratelimits, but only when enabled. This requires an additional redis connection. - [Recaptcha support](2.configuration.md#captcha), the server can verify Recaptcha v3 tokens on register and login.
- [Ratelimits](2.configuration.md#ratelimits), some expensive endpoints have ratelimits, but only when enabled. This requires an additional redis connection.
## Migrations ## Migrations
To run migrations, You can use the command `pnpm migration:up` inside the docker container. Migrations help keep your database schema in sync with everyone else. To run migrations, you can use the `pnpm migration:up` command inside the docker container or in your command-line if you're not using docker.
Alternatively, you can enabled `postgres.migrateOnBoot` and it will be automatically migrated on boot. Alternatively, you can enable the [`postgres.migrateOnBoot`](2.configuration.md#postgresmigrateonboot) variable and it will be automatically migrated on boot.

View File

@ -1,27 +1,34 @@
--- ---
title: 'Deploy' title: 'Deploy'
--- ---
# Deploying the backend # Deploying the backend
The only officially recognized hosting method is through Docker (or similar container runtimes). The only officially recognized hosting method is through Docker (or similar container runtimes). It can be scaled horizontally to all your heart's content and is the safest way to host the backend.
It can be scaled horizontally to all your heart's content.
For configuration, check out the [configuration reference](2.configuration.md). For configuration, check out the [configuration reference](2.configuration.md).
::alert{type="info"} ::alert{type="info"}
The postgres database will need to be populated with [migrations](0.introduction.md) if `postgres.migrateOnBoot` isn't enabled. The postgres database will need to be populated with [migrations](0.introduction.md#migrations) if `postgres.migrateOnBoot` isn't enabled.
:: ::
## Method 1 - Docker ## Method 1 - Docker
For other versions, [check out the package page](https://github.com/movie-web/backend/pkgs/container/backend). This method will help you set up the backend with the bare minimum configuration options. You'll most likely want to [add some more environment variables](2.configuration.md) to customize your experience more thoroughly.
The command below will not work unless customized by you, change the [`MWB_POSTGRES__CONNECTION`](2.configuration.md#postgresconnection) and [`MWB_CRYPTO__SESSION_SECRET`](2.configuration.md#cryptosessionsecret) to something valid for the backend to function.
If you're using a hosted postgres database like [Neon](https://neon.tech/){target="\_blank"}, you'll also want to enable SSL support for the backend using the [`postgres.ssl`](2.configuration.md#postgresssl) option.
For other versions of the image, [check out the package page](https://github.com/movie-web/backend/pkgs/container/backend){target="\_blank"}.
```sh ```sh
docker run \ docker run \
-p 80:80 \ -p 80:80 \
-e POSTGRES__CONNECTION=postgresql://localhost:5432 \ -e MWB_POSTGRES__CONNECTION=postgresql://localhost:5432 \
-e CRYPTO__SESSION_SECRET=add-your-own-secret \ -e MWB_CRYPTO__SESSION_SECRET=add-your-own-secret \
-e META__NAME=unofficial-movie-web \ -e MWB_META__NAME=unofficial-movie-web \
ghcr.io/movie-web/backend:latest ghcr.io/movie-web/backend:latest
``` ```
After running that command, your backend [_should_](../1.self-hosting/4.troubleshooting.md) now be available on `localhost:80`. if you want to be able to connect to the backend outside of your local network (for example sharing it with your friends), then you'll need set up to port forwarding.

View File

@ -1,139 +1,238 @@
--- ---
title: 'Configuration' title: 'Configuration'
--- ---
# Backend Config Reference # Backend Config Reference
The config the backend can be provided in 3 ways. The backend can be configured in 3 different ways:
- Make a `config.json` file in the working directory of the application (root of repository) - Make a `config.json` file in the working directory of the application (root of repository)
- Make a `.env` file in the working directory of the application (root of repository) - Make a `.env` file in the working directory of the application (root of repository)
- Add environment variables to your system (or container) - Add environment variables to your system (or container)
## Method 1 - `config.json` These different config options are all mutually inclusive, so you can use multiple at the same time if you want to.
::alert{type="warning"}
With any of these configurations, you have to have atleast three variables set for the server to function:
[`postgres.connection`](#postgresconnection), [`crypto.sessionSecret`](#cryptosessionsecret) and [`meta.name`](#metaname)
::
### Method 1 - `config.json`
This method uses nesting, so the key `server.basePath` with the value of `"/backend"` will result in a file that looks like this:
This method uses nesting. So the key `server.basePath`. Will result in a json file like this:
```json ```json
{ {
"server": { "server": {
"basePath": "/backend", "basePath": "/backend"
} }
} }
``` ```
## Method 2 - `.env` ### Method 2 - `.env`
The environment variable names use double underscores as separators and `MWB_` as the prefix. So the key `server.basePath` will result in the .env file like this: The environment variable names use double underscores as separators and `MWB_` as the prefix. So the key `server.basePath` will result in the .env file like this:
```sh ```sh
MWB_SERVER__BASE_PATH=/backend MWB_SERVER__BASE_PATH=/backend
``` ```
## Method 3 - Environment ### Method 3 - Environment
This method is identical to the `.env` method listed above, but you add the variables to the environment instead of writing it in a file. This method is identical to the `.env` method listed above, but you add the variables to the environment instead of writing it in a file.
# Reference # Reference
## Server
All configurations related to the HTTP server.
### `server.port` ### `server.port`
- Type: `number`
- Default: `8080`
Port number that the HTTP server listens on. Port number that the HTTP server listens on.
Example: `8080`
### `server.cors` ### `server.cors`
- Type: `string`
- Default: `""`
- Example: `"https://movie-web.app https://testing.movie-web.app"`
Space seperated list of allowed origins. Space seperated list of allowed origins.
Example:
```
https://movie-web.app https://testing.movie-web.app
```
### `server.allowAnySite` ### `server.allowAnySite`
If this setting is set to true, it allows any origin to access the site.
This overwrites the setting at `server.cors`.
Example: `false` - Type: `boolean`
- Default: `false`
If set to true, it allows any origin to access the site. This overwrites the [`server.cors`](#servercors) setting.
### `server.trustProxy` ### `server.trustProxy`
Should the server trust reverse proxy headers? This is used to identify users for ratelimiting
Example: `false` - Type: `boolean`
- Default: `false`
Controls whether the server should trust reverse proxy headers. This is used to identify users for ratelimiting.
### `server.trustCloudflare` ### `server.trustCloudflare`
Should the server trust cloudflare IP headers? This is used to identify users for ratelimiting
Example: `false` - Type: `boolean`
- Default: `false`
Controls whether the server should trust Cloudflare IP headers. This is used to identify users for ratelimiting.
### `server.basePath` ### `server.basePath`
Prefix for which path is being listened on. Useful you're hosting on `example.com/backend` for example.
If this is set, you shouldn't apply url rewriting before proxying.
Example: `/backend` - Type: `string`
- Default: `"/"`
Prefix for which path is being listened on. Useful if you're hosting on `example.com/backend` for example.
::alert{type="info"}
If this is set, you shouldn't apply URL rewriting before proxying.
::
## Logging
All configurations related to how the HTTP server will log. This is not related to the [metrics](0.introduction.md#metrics) endpoint.
### `logging.format` ### `logging.format`
Logging format, Should be either `pretty` or `json`.
Example: `pretty` - Type: `string` | `"pretty" | "json"`
- Default: `"pretty"`
Logging format to use, should be either `pretty` or `json`, most users should probably use the default.
## Postgres
All configurations related to how postgres functions.
### `postgres.connection`
- Type: `string`
- Example: `"postgresql://localhost:5432"`
### `postgres.connection` - REQUIRED
Connection URL for postgres instance, should contain the database in the URL. Connection URL for postgres instance, should contain the database in the URL.
Example: `postgresql://localhost:5432` ::alert{type="danger"}
**Required. The backend will not start if this is not configured.**
::
### `postgres.migrateOnBoot` ### `postgres.migrateOnBoot`
Run all migrations that haven't ran yet on boot.
Example: `false` - Type: `boolean`
- Default: `false`
::alert{type="warn"} Run all [migrations](0.introduction.md#migrations) that haven't ran yet on boot.
::alert{type="warning"}
If you have multiple replicas running, this can cause a lot of issues. We recommend only using this if you run only one replica. If you have multiple replicas running, this can cause a lot of issues. We recommend only using this if you run only one replica.
:: ::
### `postgres.debugLogging` ### `postgres.debugLogging`
Log all postgres queries in the console, this outputs sensitive data so DO NOT run it in production.
Example: `false` - Type: `boolean`
- Default: `false`
### `crypto.sessionSecret` - REQUIRED Log all postgres queries in the console. Useful for debugging issues with the database.
The secret used to sign sessions. Must be at least 32 characters long.
Example: `Make your own` ::alert{type="warning"}
This outputs sensitive, **DO NOT** run it in production.
::
### `meta.name` - REQUIRED ## Cryptography
All configurations related to cryptography.
### `crypto.sessionSecret`
- Type: `string`
The secret used to sign sessions. **Must be at least 32 characters long.**
::alert{type="danger"}
**Required. The backend will not start if this is not configured.**
::
## Meta
These options configure how the server will display itself to the frontend.
### `meta.name`
- Type: `string`
- Example: `"Unofficial movie-web"`
The name of the backend instance, this will be displayed to users who try to create an account. The name of the backend instance, this will be displayed to users who try to create an account.
Example: `Unofficial movie-web` ::alert{type="danger"}
**Required. The backend will not start if this is not configured.**
::
### `meta.description` ### `meta.description`
- Type: `string`
- Default: `""`
- Example: `"This is not an official instance of movie-web"`
The description of the backend instance, this will be displayed to users who try to create an account. The description of the backend instance, this will be displayed to users who try to create an account.
Example: `This is not an official instance of movie-web` ## Captcha
All configurations related to adding captcha functionality. Captchas' help to protect your server from bot attacks.
### `captcha.enabled` ### `captcha.enabled`
To protect your server from bot attacks, captcha's can be useful to enabled. If this is enabled, all other captcha related settings are required. - Type: `boolean`
- Default: `false`
Example: `false` Enables [Recaptcha](https://www.google.com/recaptcha/about/) support for user registration and login. [You can follow this guide to create a Recaptcha key](https://cloud.google.com/recaptcha-enterprise/docs/create-key-website#create-key){target="\_blank"}.
::alert{type="warning"}
If this is enabled, all other captcha related settings are required.
::
### `captcha.secret` ### `captcha.secret`
Google Recaptcha secret key. - Type: `string`
- Default: `""`
- Example: `"sjgaJ@3djasFVx"`
Example: `sjgaJ@3djasFVx` [Google Recaptcha](https://www.google.com/recaptcha/about/) secret key.
### `captcha.clientKey` ### `captcha.clientKey`
Google Recaptcha site key. - Type: `string`
- Default: `""`
- Example: `"2jf853z5bc63bvDb2323FAda"`
Example: `2jf853z5bc63bvDb2323FAda` [Google Recaptcha](https://www.google.com/recaptcha/about/) site key.
## Ratelimits
All configuration options related to adding ratelimiting functionality. Helps to protect against bot attacks or spammy users.
::alert{type="info"}
Make sure your IP headers are properly forwarded if you're using a reverse proxy. Also see [`server.trustProxy`](#servertrustproxy).
::
### `ratelimits.enabled` ### `ratelimits.enabled`
To protect bot attacks or spammy users, you can enabled ratelimits. Make sure your ip headers are properly forwarded if you're using a reverse proxy. Also see `server.trustProxy`. If this is enabled, all other ratelimit related settings are required. - Type: `boolean`
- Default: `false`
Example: `false` Enables ratelimiting some more expensive endpoints.
::alert{type="warning"}
If this is enabled, all other ratelimit related settings are required.
::
### `ratelimits.redisUrl` ### `ratelimits.redisUrl`
Redis connection URL for storing ratelimit data. Just uses plain redis without any modules. - Type: `string`
- Default: `""`
- Example: `"redis://localhost:6379"`
Example: `redis://localhost:6379` Redis connection URL for storing ratelimit data. You can use a plain redis instance for this, no modules are required.

View File

@ -12,7 +12,6 @@ For this update, you will need to run migrations.
- Removed unused table - Removed unused table
- Optimized prometheus metrics, should make less indexes - Optimized prometheus metrics, should make less indexes
# Version 1.1.5 # Version 1.1.5
Initial version of the backend. Initial version of the backend.

View File

@ -1,3 +1,3 @@
title: 'Backend' title: 'Backend'
icon: mdi:server-network icon: mdi:database
navigation.redirect: /backend/introduction navigation.redirect: /backend/introduction

View File

@ -6,6 +6,6 @@ export default defineNuxtConfig({
modules: [ modules: [
// Remove it if you don't use Plausible analytics // Remove it if you don't use Plausible analytics
// https://github.com/nuxt-modules/plausible // https://github.com/nuxt-modules/plausible
'@nuxtjs/plausible' '@nuxtjs/plausible',
] ],
}) });

View File

@ -7,15 +7,19 @@
"build": "nuxi build", "build": "nuxi build",
"generate": "nuxi generate", "generate": "nuxi generate",
"preview": "nuxi preview", "preview": "nuxi preview",
"lint": "eslint ." "lint": "eslint .",
"lint:fix": "eslint --fix ."
}, },
"devDependencies": { "devDependencies": {
"@nuxt-themes/docus": "latest", "@nuxt-themes/docus": "latest",
"@nuxt/devtools": "^0.8.5", "@nuxt/devtools": "^1.0.6",
"@nuxt/eslint-config": "^0.2.0", "@nuxt/eslint-config": "^0.2.0",
"@nuxtjs/plausible": "^0.2.3", "@nuxtjs/plausible": "^0.2.4",
"@types/node": "^20.8.2", "@types/node": "^20.10.6",
"eslint": "^8.50.0", "eslint": "^8.56.0",
"nuxt": "^3.7.4" "eslint-config-prettier": "^9.1.0",
"eslint-plugin-prettier": "^5.1.2",
"nuxt": "^3.9.0",
"prettier": "^3.1.1"
} }
} }

File diff suppressed because it is too large Load Diff

Binary file not shown.

Before

Width:  |  Height:  |  Size: 214 KiB

After

Width:  |  Height:  |  Size: 328 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 24 KiB

After

Width:  |  Height:  |  Size: 15 KiB

BIN
public/icon.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.1 KiB

View File

@ -1,8 +1,6 @@
{ {
"extends": [ "extends": ["@nuxtjs"],
"@nuxtjs" "lockFileMaintenance": {
], "enabled": true
"lockFileMaintenance": { }
"enabled": true
}
} }

View File

@ -1,18 +1,18 @@
import { defineTheme } from 'pinceau' import { defineTheme } from 'pinceau';
export default defineTheme({ export default defineTheme({
color: { color: {
primary: { primary: {
50: "#F5E5FF", 50: '#F5E5FF',
100: "#E7CCFF", 100: '#E7CCFF',
200: "#D4A9FF", 200: '#D4A9FF',
300: "#BE85FF", 300: '#BE85FF',
400: "#A861FF", 400: '#A861FF',
500: "#8E3DFF", 500: '#8E3DFF',
600: "#7F36D4", 600: '#7F36D4',
700: "#662CA6", 700: '#662CA6',
800: "#552578", 800: '#552578',
900: "#441E49" 900: '#441E49',
} },
} },
}) });