# CORS is not working with Traefik

**URL:** <https://community.traefik.io/t/cors-is-not-working-with-traefik/25906>\
**Category:** Traefik v3 (latest)\
**Tags:** docker, middleware\
**Created:** [January 8, 2025, 7:19pm UTC](https://community.traefik.io/t/cors-is-not-working-with-traefik/25906 "2025-01-08T19:19:22Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![eastlight](https://avatars.discourse-cdn.com/v4/letter/e/13edae/32.png) [@eastlight](https://community.traefik.io/u/eastlight)\
**Post date:** [January 8, 2025, 7:19pm UTC](https://community.traefik.io/t/cors-is-not-working-with-traefik/25906/1 "2025-01-08T19:19:23Z")

</div>

I'm using Traefik as a reverse-proxy for TLS which is working fine though curl requests, although the browser (Firefox) is disallowing access because `The Same Origin Policy disallows reading the remote resource`

The docker setup works without Traefik, and I've followed mostly all the guides/advice I could find about setting up CORS middleware but seem to have hit a dead end. Any advice would be appreciated!

**Output of a curl request**

```auto

$ curl -I -X OPTIONS http://example.com \
  -H "Origin: http://example.com \
  -H "Access-Control-Request-Method: GET" \
  -H "Access-Control-Request-Headers: Content-Type, Authorization"
HTTP/1.1 200 OK
Access-Control-Allow-Headers: *
Access-Control-Allow-Methods: *
Access-Control-Allow-Origin: *
Access-Control-Max-Age: 100
Date: Wed, 08 Jan 2025 18:24:20 GMT
Content-Length: 0

```

**docker-compose.yml**

```auto
version: "3.8"
services:
  api:
    hostname: api
    build:
      context: ./api
      dockerfile: api.Dockerfile
    ports:
      - "5000:5000"
    restart: always
    logging:
      driver: "json-file"
      options:
        max-size: "10m"
        max-file: "3"
    labels:
      - "traefik.enable=true"
      - "traefik.http.middlewares.cors.headers.accessControlAllowMethods=*"
      - "traefik.http.middlewares.cors.headers.accessControlAllowOriginList=*"
      - "traefik.http.middlewares.cors.headers.allowedHosts=*"
      - "traefik.http.middlewares.cors.headers.accessControlAllowHeaders=*"
      - "traefik.http.middlewares.cors.headers.accessControlMaxAge=100"
      - "traefik.http.middlewares.cors.headers.addVaryHeader=true"

      - "traefik.http.routers.web.rule=Host(`example.com`)"
      - "traefik.http.routers.web.middlewares=cors"

      - "traefik.http.routers.websecure.rule=Host(`example.com`)"
      - "traefik.http.routers.websecure.middlewares=cors"
      - "traefik.http.routers.websecure.tls=true"
      - "traefik.http.routers.websecure.tls.certresolver=letsencrypt"

  traefik:
    image: "traefik:v3.3"
    container_name: "traefik"
    command:
      - "--api.insecure=true"
      - "--api.dashboard=false"
      - "--providers.docker=true"
      - "--providers.docker.exposedbydefault=false"
      - "--entryPoints.web.address=:80"
      - "--entryPoints.websecure.address=:443"
      - "--certificatesresolvers.letsencrypt.acme.tlschallenge=true"
      - "--certificatesresolvers.letsencrypt.acme.email=user@example.com"
      - "--certificatesresolvers.letsencrypt.acme.storage=/letsencrypt/acme.json"
    ports:
      - "443:443"
      - "80:80"
    volumes:
      - "./letsencrypt:/letsencrypt"
      - "/var/run/docker.sock:/var/run/docker.sock:ro"

```

---

<div class="post-metadata">

**Author:** ![bluepuma77](https://avatars.discourse-cdn.com/v4/letter/b/a9adbd/32.png) [@bluepuma77](https://community.traefik.io/u/bluepuma77)\
**Post date:** [January 8, 2025, 8:28pm UTC](https://community.traefik.io/t/cors-is-not-working-with-traefik/25906/2 "2025-01-08T20:28:59Z")

</div>

Maybe check the [Traefik headers middleware doc](https://doc.traefik.io/traefik/middlewares/http/headers/) again, this works for us:

```auto
      - traefik.http.middlewares.cors.headers.customresponseheaders.Access-Control-Allow-Origin=*
      - traefik.http.middlewares.cors.headers.customresponseheaders.Access-Control-Allow-Methods=GET,POST,OPTIONS
      - traefik.http.middlewares.cors.headers.customresponseheaders.Access-Control-Allow-Headers=*

```

---

<div class="post-metadata">

**Author:** ![eastlight](https://avatars.discourse-cdn.com/v4/letter/e/13edae/32.png) [@eastlight](https://community.traefik.io/u/eastlight)\
**Post date:** [January 9, 2025, 4:20pm UTC](https://community.traefik.io/t/cors-is-not-working-with-traefik/25906/3 "2025-01-09T16:20:35Z")

</div>

Thanks very much @bluepuma77! That worked a charm.

In case anyone else finds it useful, this is what the functional `labels:` section looks like.

```auto
    labels:
      - "traefik.enable=true"
      - "traefik.http.middlewares.cors.headers.customresponseheaders.Access-Control-Allow-Origin=*"
      - "traefik.http.middlewares.cors.headers.customresponseheaders.Access-Control-Allow-Methods=*"
      - "traefik.http.middlewares.cors.headers.customresponseheaders.Access-Control-Allow-Headers=*"

      - "traefik.http.routers.web.rule=Host(`example.com`)"
      - "traefik.http.routers.web.middlewares=cors"

      - "traefik.http.routers.websecure.rule=Host(`example.com`)"
      - "traefik.http.routers.websecure.middlewares=cors"
      - "traefik.http.routers.websecure.tls=true"
      - "traefik.http.routers.websecure.tls.certresolver=letsencrypt"

```

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex020/uploads/containo/original/2X/b/bd81ebdb578656e76e56ff3cc3eed021d3ba132d.png) [@system](https://community.traefik.io/u/system)\
**Post date:** [January 12, 2025, 4:21pm UTC](https://community.traefik.io/t/cors-is-not-working-with-traefik/25906/4 "2025-01-12T16:21:07Z")

</div>

This topic was automatically closed 3 days after the last reply. New replies are no longer allowed.