fix(static): UI does not send requests to registry under non-root url (#73)

Add example for this issue
fixes: #73

README.md

@@ -9,7 +9,7 @@ All registries will be stored in the [local storage](https://en.wikipedia.org/wi
 
 This web user interface uses [Riot](https://github.com/Riot/riot) the react-like user interface micro-library and [riot-mui](https://github.com/kysonic/riot-mui) components.
 
-## [GitHub Page](https://joxit.github.io/docker-registry-ui) and [Live Demo](https://joxit.github.io/docker-registry-ui/demo/)
+## [GitHub Page](https://joxit.dev/docker-registry-ui) and [Live Demo](https://joxit.dev/docker-registry-ui/demo/)
 
 ![preview](https://raw.github.com/Joxit/docker-registry-ui/master/docker-registry-ui.gif "Preview of Docker Registry UI")
 
@@ -20,7 +20,7 @@ This web user interface uses [Riot](https://github.com/Riot/riot) the react-like
 -   Sort the tag list
 -   One interface for many registries
 -   Use a secured docker registry
--   Share your docker registry with query parameter `url` (e.g. `https://joxit.github.io/docker-registry-ui/demo?url=https://registry.example.com`)
+-   Share your docker registry with query parameter `url` (e.g. `https://joxit.dev/docker-registry-ui/demo?url=https://registry.example.com`)
 -   Use `joxit/docker-registry-ui:static` as reverse proxy to your docker registry (This will avoid CORS).
 -   Display image size (see #30)
 -   Add Title when using REGISTRY_URL (see #28)
@@ -136,14 +136,14 @@ Your server should be configured to accept CORS.
 
 If your docker registry does not need credentials, you will need to send this HEADER:
 
-    Access-Control-Allow-Origin: '*'
+    Access-Control-Allow-Origin: ['*']
 
 If your docker registry need credentials, you will need to send these HEADERS:
 
 ```yml
 http:
   headers:
-    Access-Control-Allow-Origin: '<your docker-registry-ui url>'
+    Access-Control-Allow-Origin: ['<your docker-registry-ui url>']
     Access-Control-Allow-Credentials: true
     Access-Control-Allow-Methods: ['HEAD', 'GET', 'OPTIONS'] # Optional
 ```

_config.yml

@@ -1,3 +1,6 @@
 title: Docker Registry v2 User Interface
 google_analytics: UA-99119327-1
-theme: jekyll-theme-cayman
+theme: jekyll-theme-cayman
+author: Jones Magloire
+twitter:
+  username: Joxit

examples/issue-73/docker-compose.yml

@@ -0,0 +1,31 @@
+version: '2.0'
+services:
+  registry:
+    image: registry:2.6.2
+    volumes:
+      - ./registry-data:/var/lib/registry
+    networks:
+      - registry-ui-net
+
+  ui:
+    image: joxit/docker-registry-ui:static
+    environment:
+      - REGISTRY_TITLE=My Private Docker Registry
+      - REGISTRY_URL=http://registry:5000
+    depends_on:
+      - registry
+    networks:
+      - registry-ui-net
+
+  proxy:
+    image: nginx:alpine
+    volumes:
+      - ./nginx.conf:/etc/nginx/conf.d/default.conf
+    ports:
+      - 80:80
+    depends_on:
+      - ui
+    networks:
+      - registry-ui-net
+networks:
+  registry-ui-net:

examples/issue-73/nginx.conf

@@ -0,0 +1,35 @@
+server {
+    listen       80;
+    server_name  localhost;
+    resolver 127.0.0.11; # This is for docker container name resolver
+    #charset koi8-r;
+    #access_log  /var/log/nginx/host.access.log  main;
+
+    # disable any limits to avoid HTTP 413 for large image uploads
+    client_max_body_size 0;
+
+    # required to avoid HTTP 411: see Issue #1486 (https://github.com/moby/moby/issues/1486)
+    chunked_transfer_encoding on;
+    # required for strict SNI checking: see Issue #70 (https://github.com/Joxit/docker-registry-ui/issues/70)
+    proxy_ssl_server_name on;
+
+    location /ui/ {
+        proxy_pass http://ui/;
+    }
+
+    #error_page  404              /404.html;
+
+    # redirect server error pages to the static page /50x.html
+    #
+    error_page   500 502 503 504  /50x.html;
+    location = /50x.html {
+        root   /usr/share/nginx/html;
+    }
+
+    # deny access to .htaccess files, if Apache's document root
+    # concurs with nginx's one
+    #
+    #location ~ /\.ht {
+    #    deny  all;
+    #}
+}

package.json

@@ -1,6 +1,6 @@
 {
   "name": "docker-registry-ui",
-  "version": "1.1.0",
+  "version": "1.1.1",
   "scripts": {
     "build": "./node_modules/gulp/bin/gulp.js build"
   },

src/scripts/static.js

@@ -16,7 +16,12 @@
  */
 var registryUI = {}
 registryUI.url = function() {
-  return '${URL}';
+  var url = '${URL}';
+  if (!url) {
+    url = window.location.origin + window.location.pathname;
+    return url.endsWith('/') ? url.substr(0, url.length - 1) : url;
+  }
+  return url;
 };
 registryUI.name = function() {
   return '${REGISTRY_TITLE}' || registryUI.url();