CORS headers only showing in root with Caddy

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!

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

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

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"
    }
}

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?

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.

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