where to put Access-Control-Allow-Origin header?

[pcace]

hi there, i am running your registry ui wich is supposed to use my private registry.
so i am running this: joxit/docker-registry-ui:latest with these environment variables:
REGISTRY_TITLE=asdfasdf
SIGNLE_REGISTRY=true
REGISTRY_URL=https://dockerregistry.beta.url.com
the registry needs pw/user authentification (via htaccess) it also has in the nginx configuration:

         add_header 'Access-Control-Allow-Origin' '*'
         add_header 'Access-Control-Allow-Credentials' 'true'
         add_header 'Access-Control-Allow-Headers' 'Authorization, Accept, Cache-Control'
         add_header 'Access-Control-Allow-Methods' 'HEAD, GET, OPTIONS'

i sadly still get the Access-Control-Allow-Origin error:

accessing this in the browser totally works:
https://dockerregistry.beta.url.com/v2/_catalog?n=100000

what am i doing wrong here? any help would be great!!
Thanks a lot!

[Joxit]

Hello, thank you for using my project.

Please read the documentation about CORS

If your docker registry need credentials, you will need to send these HEADERS (you must add the protocol http/https and the port when not default 80/443):

That means in your nginx configuration you should use this line instead of *

         add_header 'Access-Control-Allow-Origin' 'https://dockerregistry.beta.url.com'

[sorcerb]

Hello, Joxit
Thank you for nice product.
I have same problem.
I have pc on windows + laptop with ubuntu and docker.

I created on ubuntu 2 site: registry.site and ui.registry.site
I ran docker compose from examples/ui-as-standalone/
Nginx was configured (not docker) to proxy_pass localhost:5000->registry.site and localhost:5001->ui.registry.site

1. If I add: add_header 'Access-Control-Allow-Origin' 'https://registry.site' web show popup error, that need use CORS like "ui.registry.site"
2. If I add: add_header 'Access-Control-Allow-Origin' 'https://ui.registry.site' I got this:
   

Cors error becuse 1 reques body has no header:

Request URL: https://registry.site/v2/test/manifests/1.0.0
Referrer Policy: strict-origin-when-cross-origin

401 Auth error, header has cors :

Request URL: https://registry.site/v2/test/manifests/1.0.0
Request Method: OPTIONS
Status Code: 401 Unauthorized
Remote Address: 192.168.0.181:443
Referrer Policy: strict-origin-when-cross-origin

Access-Control-Allow-Credentials: true
Access-Control-Allow-Headers: Authorization
Access-Control-Allow-Headers: Accept
Access-Control-Allow-Methods: HEAD
Access-Control-Allow-Methods: GET
Access-Control-Allow-Methods: OPTIONS
Access-Control-Allow-Methods: DELETE
Access-Control-Allow-Origin: https://ui.registry.site
Access-Control-Expose-Headers: Docker-Content-Digest
Access-Control-Max-Age: 1728000

[Joxit]

Hi @sorcerb okay, so this one is in the FAQ

• Why OPTIONS (aka preflight requests) and DELETE fails with 401 status code (using Basic Auth) ?
  • This is caused by a bug in docker registry, it returns 401 status requests on preflight requests, this breaks W3C preflight-request specification. I suggest to have your UI on the same domain than your registry e.g. registry.example.com/ui/ or use NGINX_PROXY_PASS_URL or configure a nginx/apache/haproxy in front of your registry that returns 200 on each OPTIONS requests. (see #104, #204, #207, #214, #266).

So your options are :

1. As I said in the FAQ, use NGINX_PROXY_PASS_URL
2. Configure a nginx/apache/haproxy in front of your docker registry server and return 200 on each OPTION requests

[pcace]

Hello, thank you for using my project.

Please read the documentation about CORS

If your docker registry need credentials, you will need to send these HEADERS (you must add the protocol http/https and the port when not default 80/443):

That means in your nginx configuration you should use this line instead of *

         add_header 'Access-Control-Allow-Origin' 'https://dockerregistry.beta.url.com'

Hi,

thanks for your reply but i still cannot really figure out how to make it work.
can i use env variables to achieve this? so that i can run the whole thing directly form docker like so somehow:

image: joxit/docker-registry-ui:static
    ports:
      - 8080:80
    environment:
    here somehow the line
             add_header 'Access-Control-Allow-Origin' 'https://dockerregistry.beta.url.com'
    as env variable?

[Joxit]

The line add_header 'Access-Control-Allow-Origin' 'https://dockerregistry.beta.url.com' was inspired from your first post, I was supposing you were configuring your own nginx server ?

As I said last time you should read the CORS section from the doc. If you want to add the access control allow origin, this is a docker registry server configuration, or your personal nginx configuration, not a UI one!

If you want to configure your docker registry server, add in your config.yml

http:
  headers:
    Access-Control-Allow-Origin: ['http://registry.example.com']
    Access-Control-Allow-Credentials: [true]
    Access-Control-Allow-Headers: ['Authorization', 'Accept', 'Cache-Control']
    Access-Control-Allow-Methods: ['HEAD', 'GET', 'OPTIONS'] # Optional

[gergaly]

Hi @Joxit,

I have a related question regarding multiple entries in Access-Control-Allow-Origin header. I use basic auth in my registry. With this header:
Access-Control-Allow-Origin: ['http://10.0.0.109']
It works when I access the UI via the IP. But if I access the UI via its domain name it does not work. If I replace the IP with the domain name in the header it works when I access the UI via the name but not via IP.
If use multiple entries in the header:
Access-Control-Allow-Origin: ['http://10.0.0.109', 'http://myregistry.mydomin.com']
it doesn't work at all. Also the '*' in the header doesn't work either.

So, my question would be: Are the multiple entries in the Access-Control-Allow-Origin supported? Or I have to just pick one? Or I should ditch the basic auth and it will work then?

[Joxit]

Hi @gergaly , please refer to the Access-Control-Allow-Origin documentation

For requests without credentials, the literal value "*" can be specified as a wildcard; the value tells browsers to allow requesting code from any origin to access the resource. Attempting to use the wildcard with credentials results in an error.

This is applied to multiple origins too, when you're using credentials/basic auth, only one origin can be set, this is a part of your browser security.

As I said in other messages, if you want to get rid of CORS issues, use NGINX_PROXY_PASS_URL option.