Adds base option (#5)

amir20 · web-flow · commit f7b28ad1e023 · 2018-11-19T13:04:06.000-08:00
* Adds base option

* Removes base unused

* Adds readme

* Adds redirect
diff --git a/README.md b/README.md
@@ -24,12 +24,22 @@ dozzle will be available at [http://localhost:8888/](http://localhost:8888/). Yo
 
 #### Security
 
-dozzle doesn't support authentication out of the box. You can control the device dozzle binds to by passing `-addr` parameter. For example,
+dozzle doesn't support authentication out of the box. You can control the device dozzle binds to by passing `--addr` parameter. For example,
 
-    $ docker run --volume=/var/run/docker.sock:/var/run/docker.sock -p 8888:1224 amir20/dozzle:latest -addr localhost:1224
+    $ docker run --volume=/var/run/docker.sock:/var/run/docker.sock -p 8888:1224 amir20/dozzle:latest --addr localhost:1224
 
 will bind to `localhost` on port `1224`. You can then use use reverse proxy to control who can see dozzle.
 
+#### Changing base URL
+
+dozzle by default mounts to "/". If you want to control the base path you can use the `--base` option. For example, if you want to mount at "/foobar",
+then you can override by using `--base /foobar`.
+
+    $ docker run --volume=/var/run/docker.sock:/var/run/docker.sock -p 8888:1224 amir20/dozzle:latest --base /foobar
+
+dozzle will be available at [http://localhost:8080/foobar/](http://localhost:8080/foobar/).
+
+
 #### Environment variable, DOCKER_API_VERSION
 
 If you see
diff --git a/assets/App.vue b/assets/App.vue
@@ -29,7 +29,7 @@ export default {
     };
   },
   async created() {
-    this.containers = await (await fetch(`/api/containers.json`)).json();
+    this.containers = await (await fetch(`${BASE_PATH}/api/containers.json`)).json();
   }
 };
 </script>
diff --git a/assets/index.html b/assets/index.html
@@ -5,12 +5,15 @@
         <meta name="viewport" content="width=device-width, initial-scale=1" />
         <title>Dozzle</title>
         <link href="https://fonts.googleapis.com/css?family=Roboto|Roboto+Mono|Gafata" rel="stylesheet">
-        <link href="./styles.scss" rel="stylesheet">
+        <link href="styles.scss" rel="stylesheet">
+        <script>
+          window["BASE_PATH"] = "{{ .Base }}";
+        </script>
         <script defer src="https://use.fontawesome.com/releases/v5.3.1/js/all.js"></script>
     </head>
 
     <body class="is-dark">
         <div id="app"></div>
-        <script src="/main.js"></script>
+        <script src="main.js"></script>
     </body>
 </html>
diff --git a/assets/main.js b/assets/main.js
@@ -22,6 +22,7 @@ const routes = [
 
 const router = new VueRouter({
   mode: "history",
+  base: BASE_PATH + "/",
   routes
 });
 
diff --git a/assets/pages/Container.vue b/assets/pages/Container.vue
@@ -60,7 +60,7 @@ export default {
         ws = null;
         this.messages = [];
       }
-      ws = new WebSocket(`ws://${window.location.host}/api/logs?id=${this.id}`);
+      ws = new WebSocket(`ws://${window.location.host}${BASE_PATH}/api/logs?id=${this.id}`);
       ws.onopen = e => console.log("Connection opened.");
       ws.onclose = e => console.log("Connection closed.");
       ws.onerror = e => console.error("Connection error: " + e.data);
diff --git a/main.go b/main.go
@@ -4,20 +4,24 @@ import (
 	"context"
 	"encoding/binary"
 	"encoding/json"
-	"flag"
 	"fmt"
+	"html/template"
 	"log"
 	"net/http"
+	"strings"
 
 	"github.com/docker/docker/api/types"
 	"github.com/docker/docker/client"
 	"github.com/gobuffalo/packr"
+	"github.com/gorilla/mux"
 	"github.com/gorilla/websocket"
+	flag "github.com/spf13/pflag"
 )
 
 var (
 	cli      *client.Client
 	addr     = flag.String("addr", ":8080", "http service address")
+	base     = flag.String("base", "/", "base address of the application to mount")
 	upgrader = websocket.Upgrader{}
 	version  = "dev"
 	commit   = "none"
@@ -34,21 +38,30 @@ func init() {
 }
 
 func main() {
+	r := mux.NewRouter()
+
+	if *base != "/" {
+		r.HandleFunc(*base, http.HandlerFunc(func(w http.ResponseWriter, req *http.Request) {
+			http.Redirect(w, req, *base+"/", http.StatusMovedPermanently)
+		}))
+	}
+
+	s := r.PathPrefix(*base).Subrouter()
 	box := packr.NewBox("./static")
-	http.HandleFunc("/api/containers.json", listContainers)
-	http.HandleFunc("/api/logs", logs)
-	http.HandleFunc("/version", versionHandler)
-	http.Handle("/", http.HandlerFunc(func(w http.ResponseWriter, req *http.Request) {
+
+	s.HandleFunc("/api/containers.json", listContainers)
+	s.HandleFunc("/api/logs", logs)
+	s.HandleFunc("/version", versionHandler)
+	s.PathPrefix("/").Handler(http.StripPrefix(*base, http.HandlerFunc(func(w http.ResponseWriter, req *http.Request) {
 		fileServer := http.FileServer(box)
-		if box.Has(req.URL.Path) {
+		if box.Has(req.URL.Path) && req.URL.Path != "" && req.URL.Path != "/" {
 			fileServer.ServeHTTP(w, req)
 		} else {
-			bytes, _ := box.Find("index.html")
-			w.Write(bytes)
+			handleIndex(box, w)
 		}
-	}))
+	})))
 
-	log.Fatal(http.ListenAndServe(*addr, nil))
+	log.Fatal(http.ListenAndServe(*addr, r))
 }
 
 func versionHandler(w http.ResponseWriter, r *http.Request) {
@@ -65,6 +78,25 @@ func listContainers(w http.ResponseWriter, r *http.Request) {
 	json.NewEncoder(w).Encode(containers)
 }
 
+func handleIndex(box packr.Box, w http.ResponseWriter) {
+	text, _ := box.FindString("index.html")
+	text = strings.Replace(text, "__BASE__", "{{ .Base }}", -1)
+	tmpl, err := template.New("index.html").Parse(text)
+	if err != nil {
+		panic(err)
+	}
+
+	path := ""
+	if *base != "/" {
+		path = *base
+	}
+	data := struct{ Base string }{Base: path}
+	err = tmpl.Execute(w, data)
+	if err != nil {
+		panic(err)
+	}
+}
+
 func logs(w http.ResponseWriter, r *http.Request) {
 	id := r.URL.Query().Get("id")
 	c, err := upgrader.Upgrade(w, r, nil)
@@ -86,7 +118,7 @@ func logs(w http.ResponseWriter, r *http.Request) {
 	for {
 		_, err := reader.Read(hdr)
 		if err != nil {
-            log.Panicln(err)
+			log.Panicln(err)
 		}
 		count := binary.BigEndian.Uint32(hdr[4:])
 		n, err := reader.Read(content[:count])
diff --git a/package.json b/package.json
@@ -5,8 +5,8 @@
  "main": "index.js",
  "scripts": {
   "start": "concurrently 'go run main.go' 'npm run watch-assets'",
-  "watch-assets": "parcel watch assets/index.html -d static",
-  "build": "parcel build assets/index.html -d static",
+  "watch-assets": "parcel watch --public-url '__BASE__' assets/index.html -d static",
+  "build": "parcel build --public-url '__BASE__' assets/index.html -d static",
   "clean": "rm -rf static",
   "release": "goreleaser --rm-dist"
  },

Original file line number	Diff line number	Diff line change
`@@ -29,7 +29,7 @@ export default {`
`29`	`29`	`};`
`30`	`30`	`},`
`31`	`31`	`async created() {`
`32`		- this.containers = await (await fetch(`/api/containers.json`)).json();
	`32`	+ this.containers = await (await fetch(`${BASE_PATH}/api/containers.json`)).json();
`33`	`33`	`}`
`34`	`34`	`};`
`35`	`35`	`</script>`
Original file line number	Diff line number	Diff line change
`@@ -60,7 +60,7 @@ export default {`
`60`	`60`	`ws = null;`
`61`	`61`	`this.messages = [];`
`62`	`62`	`}`
`63`		- ws = new WebSocket(`ws://${window.location.host}/api/logs?id=${this.id}`);
	`63`	+ ws = new WebSocket(`ws://${window.location.host}${BASE_PATH}/api/logs?id=${this.id}`);
`64`	`64`	`ws.onopen = e => console.log("Connection opened.");`
`65`	`65`	`ws.onclose = e => console.log("Connection closed.");`
`66`	`66`	`ws.onerror = e => console.error("Connection error: " + e.data);`