Provide better error information

[massenz]

I am using this to connect to a plain vanilla private registry running on localhost:5000 and, while I'm sure the registry works just fine (a GET localhost:5000/v2/_catalog returns all correct values (there is no authentication, no https) and another UI works just fine, this just fails with a:

An Error occurred

and no information about what could possibly have gone wrong.

I start the UI with:

$ docker run -d -p 80:80 -e URL=http://127.0.0.1:5000 -e DELETE_IMAGES=true joxit/docker-registry-ui:static
81445a6f88c7dcdcd82e034143179707b63544f398653fbc911a69a7f33a0f00

This is a simple example to verify the registry API is reachable:

$ curl -fs http://localhost:5000/v2/_catalog | python -m json.tool
{
    "repositories": [
        "8caa8/entry",
        "server/base"
    ]
}

[Joxit]

Hi,
What is your docker registry configuration ?
It may be a CORS issue, see this for a good docker registry configuration. You must add an Access-Control-Allow-Origin header in server response to indicating which origin sites are allowed.

[massenz]

This is just a dev instance, so I'm running the registry straight from these Instructions:

$ docker run -d -p 5000:5000 --restart=always --name registry-srv registry:2

Also, as mentioned above, a straight curl gets the list of images and another Registry Web UI I'm now using (hyper/docker-registry-web) works just fine.

You must add an Access-Control-Allow-Origin header in server response

While I won't argue with your design choices, I would contend that this should be rather unnecessary in a "plain vanilla" dev deployment where one just wishes to see what's possible; especially considering that a plain 'curl' "just works."

And, by the way, thanks for confirming that a better error message would be helpful to everyone 😆

It's really too bad about this: while I have found something "that works," this one seemed to have the promise of a better, more pleasant UI - I guess we'll never know...

[Joxit]

CORS (or Cross-origin Resource Sharing) is a browser security and allow by default only Same Origin requests (same URI scheme, host name, and port number). This policy prevents a malicious script on one page from obtaining access to sensitive data on another web page.

If you have the UI on http://localhost/ and registry on http://localhost:5000, without the CORS header your browser will drop the request without notification. That is why joxit/docker-registry-ui can't show your private registry.

For the error message, CORS related errors raises error event on XMLHttpRequest, and as defined in specs, this don't give custom message. That why we can't have better error messages... 😞

joxit/docker-registry-ui is a standalone User Interface and hyper/docker-registry-web is a Java webapp with a middleware for the docker registry, that why there are no CORS issue.

If you don't want to add a configuration file, you can also run your docker registry with the extra option -e REGISTRY_HTTP_HEADERS_Access-Control-Allow-Origin="*".

Anyway, I will add a new proxy config with Nginx, this should fix your issue 😉

[Joxit]

Fixed with bf3e3c9

[nvmnghia]

I still can't get it to work :(

Here's my config.yml file:

version: 0.1
log:
  fields:
    service: registry
storage:
  cache:
    blobdescriptor: inmemory
  filesystem:
    rootdirectory: /var/lib/registry
http:
  addr: :5000
  headers:
    X-Content-Type-Options: [nosniff]
    Access-Control-Allow-Origin: ['*']
    Access-Control-Allow-Methods: ['HEAD', 'GET', 'OPTIONS', 'DELETE']
#    Access-Control-Allow-Headers: ['Authorization']
#    Access-Control-Max-Age: [1728000]
#    Access-Control-Allow-Credentials: [true]
#    Access-Control-Expose-Headers: ['Docker-Content-Digest']

health:
  storagedriver:
    enabled: true
    interval: 10s
    threshold: 3

Both the UI and the registry is running inside docker, using these command:

docker run -d -p 5000:5000 -v config.yml:etc/docker/registry/config.yml --name registry registry:latest
docker run -d -p 8080:80 -e URL=localhost:5000 --name docker-registry-ui joxit/docker-registry-ui:static

Registry works, but the UI can't see the registry, it always complaining that I have to add its URL to Access-Control-Allow-Origin. I tried the non-static to no avail.

Edit: I use your -e REGISTRY_HTTP_HEADERS_Access-Control-Allow-Origin="*" but the container quits immediately with this error:

configuration error: error parsing /etc/docker/registry/config.yml: yaml: did not find expected alphabetic or numeric character

[Joxit]

The issue is in your URL environment, you should set URL to http://localhost:5000 and not localhost:5000. the http:// part is required.

[gsugambit]

I'm also running into this problem @Joxit and I understand all about CORS.

I have two docker containers in compose very simulator to whats above:

1. registry <-- this is the 2.6.2
2. registryui <-- this is your image

I am using haproxy to route domain.com to internal registryui:80
registryui:80 then shows the images from registry:5000

I've tried updating the array of Access Control Allow Origins to all of the below and neither works:

1. Access-Control-Allow-Origin: ['http://domain.com']
2. Access-Control-Allow-Origin: ['http://localhost']
3. Access-Control-Allow-Origin: ['http://registryui']

I even tried all of them together in the []. The UI always load and shows me:
`An error occured: Check your connection and your registry must have 'Access-Control-Allow-Origin' header set to 'http://domain.com'. It's as if it's not in sync with the file no matter how many times i restart the docker container etc

[gsugambit]

Maybe the problem is that haproxy is dropping the header though...hmmmm

[gsugambit]

Got it working! I had the registry_url override for your container incorrect. issue solved. thanks for an awesome app

[Joxit]

You are welcome ❤️

[xmontero]

By your words I understand that the communication to the registry is done by the browser and then rendered in javascript, not requests to your application and then the application requesting the registry, I guess.

Could this be solved browser-side? I mean... I don't want to tell my registry rare things... Even I don't want that to be my default behaviour. Could I tell to my locally-installed Firefox "hey, you browser are allowed to run requests to 192.168.2.55:5000 (where I have the registry) even if the page loaded from 192.168.2.55:9998 (where I export your project)?

At the end, it's not a registry problem, it's a browsing problem... Could we enable a "per casis" browser CORS exception?

[Joxit]

IMO, this is a registry miss-configuration and not a browser issue. CORS are used to protect us when browsing.

The second solution is to use the docker image joxit/docker-registry-ui:static with REGISTRY_URL, this configuration should avoid CORS errors (example with docker compose).

You can remove CORS restriction, but do this at your own risks !
Steps for Firefox:

about:config -> security.fileuri.strict_origin_policy -> false

sources: stackoverflow, symantec

Read more about CORS: https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS

[xmontero]

Sure. I did not mean "completely disable CORS in general". I agree this is not desirable.

I meant if we could tell Firefox "This X address is allowed to go to this Y address. But, hey browser, continue restricting the rest".

The same way when we find an outdated SSL/TSL certificate when browing an https:// page we do not need to tell the browser "hey, ignore the expiration date of all certificates" but we instruct to ignore just "that" specific certificate and continue secured in the rest of the pages.

If we could "disable CORS" selectively in the browser that would solve the problem.

[xmontero]

Works

Indeed, found it.

a) It is possible (at least with firefox)

b) IMHO I think it's cleaner doing it from the browser, as the registry itself "should not know" what clients are there. The same way no sysop would tune a MySQL server "just because someone willing to connect does some weird things" I don't think the docker registry should know about anything how it is accessed. The server is the server; and the registry itself does not care what happens in the client side. It serves an API and that's all.

Selectively allow CORS on firefox

So... going to the stuff...

In Firefox, there's this add-on: "CORS Everywhere" https://addons.mozilla.org/es/firefox/addon/cors-everywhere/?src=search that allows us SELECTIVELY to trick the CORS only for that setup.

Once installed, you can enable/disable CORS tricking:

This icon means "deactivated, do nothing", all browsing is safe.

This other icon means "browse safely for all the internet BUT for those white-listed sites, allow CORS". The trick is done by altering the response sent from the server so it effectively if it like if we set it server-side BUT without having to alter the server, which was the desired behaviour.

In the "CORS Weverywhere" setup you must whitelist a regex matching the REGISTRY SERVER address, which is the one that will be tricked.

Set the domain for the registry or the IP address in the configuration. I explicitly avoided the "s" in the http and explicitly allowed any port, for my flexibility, but the regex could be more fine-tuned.

I guess there must be similar addons for chrome and other browsers.

No restart needed

You don't need to restart anything. I did quit the Firefox by accident, but it seems it'd even work without restarting firefox.

Test

I loaded the Joxit/docker-registry-ui and saw it failing.
Then I tuned the extension configuration.
I Reloaded the Joxit/docker-registry-ui with CTRL-F5 and boom worked.
Just to test, I set an extra character in the configuration to force a mismatch. Saved. Reloaded. Boom failed (as expected).
Re-set the correct matching. Saved. Reloaded the Joxit/docker-registry-ui and boom worked again.

Hope this helps some other ones willing to use the Joxit thing and not willing to tune the registry server.

Final words

Joxit, I take advantage of this post to congratulate you for your interface! Great work and thanks to for contributing to the world :D

[xmontero]

Cross-reference: http://forums.mozillazine.org/viewtopic.php?f=38&t=3061410&p=14863227#p14863227

[Joxit]

Hi @xmontero, thanks for your message, I happy to know that my work is appreciated 😄

I linked your comment in the README

[frakman1]

@xmontero @Joxit

This firefox extension didn't work for me. See screenshot below:

I ran the default docker registry with:
docker run -d -p 5000:5000 -e REGISTRY_STORAGE_DELETE_ENABLED=true --restart=always --name registry registry:2

I ran the UI like this:
docker run -d -p 80:80 -e URL=http://127.0.0.1:5000 -e DELETE_IMAGES=false joxit/docker-registry-ui:static

I really don't want to have to re-configure how the registry is launched. I would like the UI piece to be de-coupled from the registry. The registry runs on a headless server so it doesn't have a UI so I can't launch a browser on it and open http://127.0.0.1

What are my options?

[Joxit]

Hi @frakman1

You can try this example : https://github.com/Joxit/docker-registry-ui/blob/master/examples/ui-as-proxy/ (simple.yml for docker-compose)

Or add an option to your docker registry via the config.yml

http:
  headers:
    Access-Control-Allow-Origin: ['http://10.x.x.x']

[m3talstorm]

The value of REGISTRY_HTTP_HEADERS_Access-Control-Allow-Origin should be ['*']

like:

-e REGISTRY_HTTP_HEADERS_Access-Control-Allow-Origin="['*']"

[khushwaqt]

I am facing this issue for CORS as well. Although i have tried most of the solutions but still not working. I am also fairly new to this docker thing so i am not sure what i am doing wrong here. Here are my configurations.

########################################################

simple.yml

########################################################

version: '2.0'
services:
registry:
image: registry:2.7
ports:
- 5050:5000
volumes:
- ./registry-data:/var/lib/registry
- ./registry-config/simple.yml:/etc/docker/registry/config.yml

ui:
image: joxit/docker-registry-ui:latest
ports:
- 6379:80
environment:
- REGISTRY_TITLE=Staging Registry
- REGISTRY_URL=http://172.21.182.103:5000
- SINGLE_REGISTRY=true
depends_on:
- registry

########################################################

/registry-config/simple.yml

########################################################
version: 0.1
log:
fields:
service: registry
storage:
delete:
enabled: true
cache:
blobdescriptor: inmemory
filesystem:
rootdirectory: /var/lib/registry
http:
addr: :5050
headers:
X-Content-Type-Options: [nosniff]
Access-Control-Allow-Origin: ['http://172.21.182.103:6379']
Access-Control-Allow-Methods: ['HEAD', 'GET', 'OPTIONS', 'DELETE']
Access-Control-Allow-Headers: ['Authorization', 'Accept']
Access-Control-Max-Age: [1728000]
Access-Control-Allow-Credentials: [true]
Access-Control-Expose-Headers: ['Docker-Content-Digest']

###############################################################

/etc/docker-distribution/registry/config.yml

###############################################################
version: 0.1
log:
fields:
service: registry
storage:
cache:
layerinfo: inmemory
filesystem:
rootdirectory: /var/lib/registry
http:
addr: 172.21.182.103:5000
headers:
Access-Control-Allow-Origin: ['http://172.21.182.103:6379']
Access-Control-Allow-Methods: ['HEAD', 'GET', 'OPTIONS', 'DELETE']
delete:
enabled: true

after running docker-compose -f simple.yml up -d command and visiting browser i can see the page loading but after few seconds it says check your connection and registry must have 'Access-Control-Allow-Origin' header set to ""http://172.21.182.103:6379"

[Angel-Perez-Lopez]

I also have the problem that the CORS plugin was not helping me.
This is what I did to help it.

1. Force the URL to use https://
2. The browser will tell you that this website is insecure. Go to Advance and select that you accept the risk. Nothing will be shown still on the website.
3. Go back in the URL and force again http:// (now the repositories and images will be shown.

This worked for me both in Microsoft Edge and Firefox

[emanuele-leopardi]

In case someone stumbled upon this issue and wants to have an equivalent addon for chromium-based browser you can use

https://chrome.google.com/webstore/detail/allow-cors-access-control/lhobafahddgcelffkeicbaginigeejlf

I had a registry with no credentials, so the only change I had to do was to go to
-> Open options page -> on .5 Access Control Allow Origin switch from Origin to *

[qn1213]

I added the Allow-Origin header, but the error still appears.

An error occured: Check your connection and your registry must have Access-Control-Allow-Origin header set to http://localhost:6001

Chrome console log is

GET http://localhost:6000/v2/_catalog?n=1000 net::ERR_UNSAFE_PORT

[Joxit]

Hi, please read the messages before sending issues...

Your chrome says 6000 is an unsafe port => change your port configuration and use the default one (5000) for example....