diff --git a/server/assets.go b/server/assets.go
index c66d6c6f1..398f8d189 100644
--- a/server/assets.go
+++ b/server/assets.go
@@ -60,6 +60,7 @@ func Assets(opts AssetsOpts) http.Handler {
[]byte(`src="`),
[]byte(`href="`),
[]byte(`url(`),
+ []byte(`data-basepath="`), // for forwarding basepath to frontend
},
}
up.ServeHTTP(w, r)
diff --git a/ui/src/index.js b/ui/src/index.js
index 0a6a2f1e4..45d13740c 100644
--- a/ui/src/index.js
+++ b/ui/src/index.js
@@ -1,7 +1,8 @@
import React from 'react';
import {render} from 'react-dom';
import {Provider} from 'react-redux';
-import {Router, Route, browserHistory, Redirect} from 'react-router';
+import {Router, Route, Redirect} from 'react-router';
+import {createHistory, useBasename} from 'history';
import App from 'src/App';
import AlertsApp from 'src/alerts';
@@ -28,6 +29,19 @@ const timeRange = Object.assign(defaultTimeRange, parsedTimeRange);
const store = configureStore({timeRange});
const rootNode = document.getElementById('react-root');
+let browserHistory;
+const basepath = rootNode.dataset.basepath;
+window.basepath = basepath;
+if (basepath) {
+ browserHistory = useBasename(createHistory)({
+ basename: basepath, // this is written in when available by the URL prefixer middleware
+ });
+} else {
+ browserHistory = useBasename(createHistory)({
+ basename: "",
+ });
+}
+
const Root = React.createClass({
getInitialState() {
return {
diff --git a/ui/src/index.template.html b/ui/src/index.template.html
index 691704446..b5d4cc1f6 100644
--- a/ui/src/index.template.html
+++ b/ui/src/index.template.html
@@ -5,6 +5,6 @@
Chronograf
-
+