CORS headers only showing in root with Caddy

Questions
1

Good day,

I added a CORS header in the Caddyfile to allow HTTP request from my website

n8n.mydomain.com {
    reverse_proxy n8n:5678 {
      flush_interval -1
    }
    header / {
        Access-Control-Allow-Origin https://otherdomain.com
        Access-Control-Allow-Methods "GET, POST, PUT, DELETE, OPTIONS"
        Access-Control-Allow-Headers "DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range"
        Access-Control-Expose-Headers "Content-Length,Content-Range"
}

When I make a “curl -I -X OPTIONS https://n8n.mydomain.com/”, the headers shows correctly, but when I make the same request to a webhook url (https://n8n.mydomain.com/webhook/test), I don’t get the CORS header, so I can’t make HTTP request to workflows.

How can I solve this?

Thank you!

3

Hey @illusionandcards,

This is more of a question on using Caddy than n8n, What happens if you try something like…

n8n.mydomain.com {
    reverse_proxy n8n:5678 {
      flush_interval -1
    }
    header {
        Access-Control-Allow-Origin https://otherdomain.com
        Access-Control-Allow-Methods "GET, POST, PUT, DELETE, OPTIONS"
        Access-Control-Allow-Headers "DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range"
        Access-Control-Expose-Headers "Content-Length,Content-Range"
    }
}

or maybe even header /webhook/* as it looks like the value is an exact match in the docs here: header (Caddyfile directive) — Caddy Documentation

2 Likes
4

Thanks! I’ll try in a moment and let you know if this solved the problem in case someone else has the same issue.

2 Likes
5

I’ve added header /webhook/* and it is being shown now, but I’m having this error (I’ve changed the urls):

Access to fetch at 'https://n8n.mywebsite.com/webhook/test' from origin 'https://otherdomain.com' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: The 'Access-Control-Allow-Origin' header contains multiple values 'https://otherdomain.com/, https://otherdomain.com/', but only one is allowed. Have the server send the header with a valid value, or, if an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

Do you have any clue what could be happening? Maybe n8n is changing the caddy configuration?

This is the Caddyfile I have now:

n8n.mywebsite.com {
    reverse_proxy n8n:5678 {
      flush_interval -1
    }
    header /webhook/* {
        Access-Control-Allow-Origin https://otherdomain.com
        Access-Control-Allow-Methods "GET, POST, PUT, DELETE, OPTIONS"
        Access-Control-Allow-Headers "DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range"
        Access-Control-Expose-Headers "Content-Length,Content-Range"
    }
}
6

Hey @illusionandcards,

n8n won’t be changing Caddy we don’t have that ability, Have you tried removing the Access-Control-Allow-Origin header from Caddy to see if that works?

7

I wasn’t able to make it work. I also asked the Caddy community. I changed the request from content-type to plain text and transform it to JSON back again in n8n. This works as is not blocked by CORS.