Para lograr esto, el backend `:80` debe tener una lista de "orígenes permitidos".

En este caso, la lista tendría que incluir `http://localhost:8080` para que el frontend `:8080` funcione correctamente.

## Comodines { #wildcards }

También es posible declarar la lista como `"*"` (un "comodín") para decir que todos están permitidos.

Então, para que tudo funcione corretamente, é melhor especificar explicitamente as origens permitidas.

## Usar `CORSMiddleware` { #use-corsmiddleware }

Você pode configurá-lo em sua aplicação **FastAPI** usando o `CORSMiddleware`.

* Importe `CORSMiddleware`.
* Crie uma lista de origens permitidas (como strings).
* Adicione-a como um "middleware" à sua aplicação **FastAPI**.

* `allowed_hosts` - Una list de nombres de dominio que deberían ser permitidos como nombres de host. Se soportan dominios comodín como `*.example.com` para hacer coincidir subdominios. Para permitir cualquier nombre de host, usa `allowed_hosts=["*"]` u omite el middleware.
* `www_redirect` - Si se establece en True, las requests a versiones sin www de los hosts permitidos serán redirigidas a sus equivalentes con www. Por defecto es `True`.

* `allowed_hosts` - Uma lista de nomes de domínio que são permitidos como nomes de host. Domínios com coringa, como `*.example.com`, são suportados para corresponder a subdomínios. Para permitir qualquer nome de host, use `allowed_hosts=["*"]` ou omita o middleware.
* `www_redirect` - Se definido como True, as requisições para versões sem www dos hosts permitidos serão redirecionadas para suas versões com www. O padrão é `True`.

```http
https://example.com/items/?limit=10&tool=plumbus
```

Recibirán un response de **error** que les indica que el parámetro query `tool` no está permitido:

```json
{
    "detail": [
        {
            "type": "extra_forbidden",
            "loc": ["query", "tool"],
            "msg": "Extra inputs are not permitted",
            "input": "plumbus"

  - zuplo-oss
  - zuplo
  - Kong
  - speakeasy-api
  - jess-render
  - blockbee-io
  - liblaber
  - render-sponsorships
  - renderinc
  - stainless-api
  - snapit-cypher
  - coderabbitai
  - permitio
  - LambdaTest-Inc
  - dribia
  - madisonredtfeldt
  - railwayapp
  - subtotal
  - requestly

```http
https://example.com/items/?limit=10&tool=plumbus
```

Eles receberão um retorno de **erro** informando-os que o parâmentro de consulta `tool` não é permitido:

```json
{
    "detail": [
        {
            "type": "extra_forbidden",
            "loc": ["query", "tool"],
            "msg": "Extra inputs are not permitted",
            "input": "plumbus"

Em vez disso, use o valor padrão real do parâmetro da função. Caso contrário, haveria inconsistência.

Por exemplo, isto não é permitido:

```Python
q: Annotated[str, Query(default="rick")] = "morty"
```

...porque não está claro se o valor padrão deveria ser `"rick"` ou `"morty"`.

Então, você usaria (preferencialmente):

```json
{
    "detail": [
        {
            "type": "extra_forbidden",
            "loc": ["cookie", "santa_tracker"],
            "msg": "Extra inputs are not permitted",

Por exemplo, se o cliente tentar enviar os campos de formulário:

* `username`: `Rick`
* `password`: `Portal Gun`
* `extra`: `Mr. Poopybutthole`

Ele receberá um retorno de erro informando-o que o campo `extra` não é permitido:

```json
{
    "detail": [
        {
            "type": "extra_forbidden",
            "loc": ["body", "extra"],
            "msg": "Extra inputs are not permitted",
            "input": "Mr. Poopybutthole"