Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

query: Fix external prefix and add an e2e test for it #2800

Merged
merged 12 commits into from
Jul 2, 2020
Merged
1 change: 1 addition & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,7 @@ We use *breaking* word for marking changes that are not backward compatible (rel
- [#2728](https://github.com/thanos-io/thanos/pull/2728) Query: Fixed panics when using larger number of replica labels with short series label sets.
- [#2787](https://github.com/thanos-io/thanos/pull/2787) Update Prometheus mod to pull in prometheus/prometheus#7414.
- [#2807](https://github.com/thanos-io/thanos/pull/2807) Store: decreased memory allocations while querying block's index.
- [#2800](https://github.com/thanos-io/thanos/pull/2800) Query: Fix handling of `--web.external-prefix` and `--web.route-prefix`

### Changed

Expand Down
10 changes: 9 additions & 1 deletion cmd/thanos/query.go
Original file line number Diff line number Diff line change
Expand Up @@ -57,7 +57,7 @@ func registerQuery(m map[string]setupFunc, app *kingpin.Application) {
caCert := cmd.Flag("grpc-client-tls-ca", "TLS CA Certificates to use to verify gRPC servers").Default("").String()
serverName := cmd.Flag("grpc-client-server-name", "Server name to verify the hostname on the returned gRPC certificates. See https://tools.ietf.org/html/rfc4366#section-3.1").Default("").String()

webRoutePrefix := cmd.Flag("web.route-prefix", "Prefix for API and UI endpoints. This allows thanos UI to be served on a sub-path. This option is analogous to --web.route-prefix of Promethus.").Default("").String()
webRoutePrefix := cmd.Flag("web.route-prefix", "Prefix for API and UI endpoints. This allows thanos UI to be served on a sub-path. Defaults to the value of --web.external-prefix. This option is analogous to --web.route-prefix of Promethus.").Default("").String()
webExternalPrefix := cmd.Flag("web.external-prefix", "Static prefix for all HTML links and redirect URLs in the UI query web interface. Actual endpoints are still served on / or the web.route-prefix. This allows thanos UI to be served behind a reverse proxy that strips a URL sub-path.").Default("").String()
webPrefixHeaderName := cmd.Flag("web.prefix-header", "Name of HTTP request header used for dynamic prefixing of UI links and redirects. This option is ignored if web.external-prefix argument is set. Security risk: enable this option only if a reverse proxy in front of thanos is resetting the header. The --web.prefix-header=X-Forwarded-Prefix option can be useful, for example, if Thanos UI is served via Traefik reverse proxy with PathPrefixStrip option enabled, which sends the stripped prefix value in X-Forwarded-Prefix header. This allows thanos UI to be served on a sub-path.").Default("").String()

Expand Down Expand Up @@ -139,6 +139,14 @@ func registerQuery(m map[string]setupFunc, app *kingpin.Application) {
fileSD = file.NewDiscovery(conf, logger)
}

if *webRoutePrefix == "" {
*webRoutePrefix = *webExternalPrefix
}

if *webRoutePrefix != *webExternalPrefix {
level.Warn(logger).Log("msg", "different values for --web.route-prefix and --web.external-prefix detected. WebUI may not work without a reverse-proxy")
onprem marked this conversation as resolved.
Show resolved Hide resolved
onprem marked this conversation as resolved.
Show resolved Hide resolved
}

promql.SetDefaultEvaluationInterval(time.Duration(*defaultEvaluationInterval))

flagsMap := map[string]string{}
Expand Down
3 changes: 2 additions & 1 deletion docs/components/query.md
Original file line number Diff line number Diff line change
Expand Up @@ -314,7 +314,8 @@ Flags:
returned gRPC certificates. See
https://tools.ietf.org/html/rfc4366#section-3.1
--web.route-prefix="" Prefix for API and UI endpoints. This allows
thanos UI to be served on a sub-path. This
thanos UI to be served on a sub-path. Defaults
to the value of --web.external-prefix. This
option is analogous to --web.route-prefix of
Promethus.
--web.external-prefix="" Static prefix for all HTML links and redirect
Expand Down
110 changes: 55 additions & 55 deletions pkg/ui/bindata.go

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion pkg/ui/query.go
Original file line number Diff line number Diff line change
Expand Up @@ -103,7 +103,7 @@ func (q *Query) Register(r *route.Router, ins extpromhttp.InstrumentationMiddlew
func (q *Query) root(w http.ResponseWriter, r *http.Request) {
prefix := GetWebPrefix(q.logger, q.externalPrefix, q.prefixHeader, r)

http.Redirect(w, r, path.Join(prefix, "/graph"), http.StatusFound)
http.Redirect(w, r, path.Join("/", prefix, "/graph"), http.StatusFound)
}

func (q *Query) graph(w http.ResponseWriter, r *http.Request) {
Expand Down
4 changes: 2 additions & 2 deletions pkg/ui/react-app/public/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -14,8 +14,8 @@
and set to Thanos's external URL path. It gets prepended to all links back
to Thanos, both for asset loading as well as API accesses.
-->
<script>const GLOBAL_PATH_PREFIX='';</script>
<script>const THANOS_COMPONENT='query';</script>
<script>const GLOBAL_PATH_PREFIX={{ pathPrefix }};</script>
<script>const THANOS_COMPONENT={{ .Component }};</script>

<!--
manifest.json provides metadata used when your web app is added to the
Expand Down
2 changes: 1 addition & 1 deletion pkg/ui/react-app/src/App.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@ const App: FC<PathPrefixProps & ThanosComponentProps> = ({ pathPrefix, thanosCom
<Status path="/status" pathPrefix={pathPrefix} />
<TSDBStatus path="/tsdb-status" pathPrefix={pathPrefix} />
<Targets path="/targets" pathPrefix={pathPrefix} />
<Stores path="/stores" />
<Stores path="/stores" pathPrefix={pathPrefix} />
</Router>
</Container>
</ErrorBoundary>
Expand Down
5 changes: 3 additions & 2 deletions pkg/ui/react-app/src/thanos/pages/stores/Stores.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import { RouteComponentProps } from '@reach/router';
import { Alert } from 'reactstrap';
import { withStatusIndicator } from '../../../components/withStatusIndicator';
import { useFetch } from '../../../hooks/useFetch';
import PathPrefixProps from '../../../types/PathPrefixProps';
import { Store } from './store';
import { StorePoolPanel } from './StorePoolPanel';

Expand All @@ -27,8 +28,8 @@ export const StoreContent: FC<{ data: StoreListProps }> = ({ data }) => {

const StoresWithStatusIndicator = withStatusIndicator(StoreContent);

export const Stores: FC<RouteComponentProps> = () => {
const { response, error, isLoading } = useFetch<StoreListProps>(`/api/v1/stores`);
export const Stores: FC<RouteComponentProps & PathPrefixProps> = ({ pathPrefix = '' }) => {
const { response, error, isLoading } = useFetch<StoreListProps>(`${pathPrefix}/api/v1/stores`);
const { status: responseStatus } = response;
const badResponse = responseStatus !== 'success' && responseStatus !== 'start fetching';

Expand Down
10 changes: 5 additions & 5 deletions pkg/ui/static/js/graph.js
Original file line number Diff line number Diff line change
Expand Up @@ -300,7 +300,7 @@ Prometheus.Graph.prototype.checkTimeDrift = function() {
var browserTime = new Date().getTime() / 1000;
$.ajax({
method: "GET",
url: PATH_PREFIX + "api/v1/query?query=time()",
url: PATH_PREFIX + "/api/v1/query?query=time()",
dataType: "json",
success: function(json, textStatus) {
if (json.status !== "success") {
Expand Down Expand Up @@ -328,7 +328,7 @@ Prometheus.Graph.prototype.populateInsertableMetrics = function() {
var self = this;
$.ajax({
method: "GET",
url: PATH_PREFIX + "api/v1/label/__name__/values",
url: PATH_PREFIX + "/api/v1/label/__name__/values",
dataType: "json",
success: function(json, textStatus) {
if (json.status !== "success") {
Expand Down Expand Up @@ -567,11 +567,11 @@ Prometheus.Graph.prototype.submitQuery = function() {
params.end = endDate;
params.step = resolution;
params.max_source_resolution = maxSourceResolution;
url = PATH_PREFIX + "api/v1/query_range";
url = PATH_PREFIX + "/api/v1/query_range";
success = function(json, textStatus) { self.handleGraphResponse(json, textStatus); };
} else {
params.time = moment;
url = PATH_PREFIX + "api/v1/query";
url = PATH_PREFIX + "/api/v1/query";
success = function(json, textStatus) { self.handleConsoleResponse(json, textStatus); };
}
self.params = params;
Expand Down Expand Up @@ -1271,7 +1271,7 @@ function init() {
});

$.ajax({
url: PATH_PREFIX + "static/js/graph_template.handlebar?v=" + BUILD_VERSION,
url: PATH_PREFIX + "/static/js/graph_template.handlebar?v=" + BUILD_VERSION,
success: function(data) {

graphTemplate = data;
Expand Down
2 changes: 1 addition & 1 deletion pkg/ui/static/js/graph_template.handlebar
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
</div>
<div class="col-lg-2">
<div class="eval_stats float-right"></div>
<img src="{{ pathPrefix }}static/img/ajax-loader.gif?v={{ buildVersion }}" class="spinner" alt="ajax_spinner">
<img src="{{ pathPrefix }}/static/img/ajax-loader.gif?v={{ buildVersion }}" class="spinner" alt="ajax_spinner">
</div>
</div>
<div class="form-inline">
Expand Down
14 changes: 7 additions & 7 deletions pkg/ui/templates/_base.html
Original file line number Diff line number Diff line change
Expand Up @@ -4,14 +4,14 @@
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="robots" content="noindex,nofollow">
<title>Thanos long term storage Prometheus solution</title>
<link rel="shortcut icon" href="{{ pathPrefix }}static/img/favicon.ico?v={{ buildVersion }}">
<script src="{{ pathPrefix }}static/vendor/js/jquery-3.5.0.min.js?v={{ buildVersion }}"></script>
<script src="{{ pathPrefix }}static/vendor/js/popper.min.js?v={{ buildVersion }}"></script>
<script src="{{ pathPrefix }}static/vendor/bootstrap-4.1.3/js/bootstrap.min.js?v={{ buildVersion }}"></script>
<link rel="shortcut icon" href="{{ pathPrefix }}/static/img/favicon.ico?v={{ buildVersion }}">
<script src="{{ pathPrefix }}/static/vendor/js/jquery-3.5.0.min.js?v={{ buildVersion }}"></script>
<script src="{{ pathPrefix }}/static/vendor/js/popper.min.js?v={{ buildVersion }}"></script>
<script src="{{ pathPrefix }}/static/vendor/bootstrap-4.1.3/js/bootstrap.min.js?v={{ buildVersion }}"></script>

<link type="text/css" rel="stylesheet" href="{{ pathPrefix }}static/vendor/bootstrap-4.1.3/css/bootstrap.min.css?v={{ buildVersion }}">
<link type="text/css" rel="stylesheet" href="{{ pathPrefix }}static/css/prometheus.css?v={{ buildVersion }}">
<link type="text/css" rel="stylesheet" href="{{ pathPrefix }}static/vendor/bootstrap4-glyphicons/css/bootstrap-glyphicons.min.css?v={{ buildVersion }}">
<link type="text/css" rel="stylesheet" href="{{ pathPrefix }}/static/vendor/bootstrap-4.1.3/css/bootstrap.min.css?v={{ buildVersion }}">
<link type="text/css" rel="stylesheet" href="{{ pathPrefix }}/static/css/prometheus.css?v={{ buildVersion }}">
<link type="text/css" rel="stylesheet" href="{{ pathPrefix }}/static/vendor/bootstrap4-glyphicons/css/bootstrap-glyphicons.min.css?v={{ buildVersion }}">

<script>
var PATH_PREFIX = "{{ pathPrefix }}";
Expand Down
4 changes: 2 additions & 2 deletions pkg/ui/templates/alerts.html
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{{define "head"}}
<link type="text/css" rel="stylesheet" href="{{ pathPrefix }}static/css/alerts.css?v={{ buildVersion }}">
<script src="{{ pathPrefix }}static/js/alerts.js?v={{ buildVersion }}"></script>
<link type="text/css" rel="stylesheet" href="{{ pathPrefix }}/static/css/alerts.css?v={{ buildVersion }}">
<script src="{{ pathPrefix }}/static/js/alerts.js?v={{ buildVersion }}"></script>
{{end}}

{{define "content"}}
Expand Down
4 changes: 2 additions & 2 deletions pkg/ui/templates/bucket.html
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,8 @@
<meta http-equiv="refresh" content="300"/>

<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script src="{{ pathPrefix }}static/js/bucket.js?v={{ buildVersion }}"></script>
<script src="{{ pathPrefix }}static/vendor/moment/moment.min.js?v={{ buildVersion }}"></script>
<script src="{{ pathPrefix }}/static/js/bucket.js?v={{ buildVersion }}"></script>
<script src="{{ pathPrefix }}/static/vendor/moment/moment.min.js?v={{ buildVersion }}"></script>
{{end}}

{{define "content"}}
Expand Down
2 changes: 1 addition & 1 deletion pkg/ui/templates/bucket_menu.html
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
<button type="button" class="navbar-toggler" data-toggle="collapse" data-target="#nav-content" aria-expanded="false" aria-controls="nav-content" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<a class="navbar-brand" href="{{ pathPrefix }}">Thanos Bucket Viewer</a>
<a class="navbar-brand" href="{{ pathPrefix }}/">Thanos Bucket Viewer</a>
<div id="nav-content" class="navbar-collapse collapse">
<ul class="navbar-nav">
<li class="nav-item">
Expand Down
30 changes: 15 additions & 15 deletions pkg/ui/templates/graph.html
Original file line number Diff line number Diff line change
@@ -1,25 +1,25 @@
{{define "head"}}
<link type="text/css" rel="stylesheet" href="{{ pathPrefix }}static/vendor/rickshaw/rickshaw.min.css?v={{ buildVersion }}">
<link type="text/css" rel="stylesheet" href="{{ pathPrefix }}static/vendor/eonasdan-bootstrap-datetimepicker/bootstrap-datetimepicker.min.css?v={{ buildVersion }}">
<link type="text/css" rel="stylesheet" href="{{ pathPrefix }}/static/vendor/rickshaw/rickshaw.min.css?v={{ buildVersion }}">
<link type="text/css" rel="stylesheet" href="{{ pathPrefix }}/static/vendor/eonasdan-bootstrap-datetimepicker/bootstrap-datetimepicker.min.css?v={{ buildVersion }}">

<script src="{{ pathPrefix }}static/vendor/rickshaw/vendor/d3.v3.js?v={{ buildVersion }}"></script>
<script src="{{ pathPrefix }}static/vendor/rickshaw/vendor/d3.layout.min.js?v={{ buildVersion }}"></script>
<script src="{{ pathPrefix }}static/vendor/rickshaw/rickshaw.min.js?v={{ buildVersion }}"></script>
<script src="{{ pathPrefix }}static/vendor/moment/moment.min.js?v={{ buildVersion }}"></script>
<script src="{{ pathPrefix }}static/vendor/moment/moment-timezone-with-data.min.js?v={{ buildVersion }}"></script>
<script src="{{ pathPrefix }}static/vendor/eonasdan-bootstrap-datetimepicker/bootstrap-datetimepicker.min.js?v={{ buildVersion }}"></script>
<script src="{{ pathPrefix }}static/vendor/bootstrap3-typeahead/bootstrap3-typeahead.min.js?v={{ buildVersion }}"></script>
<script src="{{ pathPrefix }}static/vendor/fuzzy/fuzzy.js?v={{ buildVersion }}"></script>
<script src="{{ pathPrefix }}/static/vendor/rickshaw/vendor/d3.v3.js?v={{ buildVersion }}"></script>
<script src="{{ pathPrefix }}/static/vendor/rickshaw/vendor/d3.layout.min.js?v={{ buildVersion }}"></script>
<script src="{{ pathPrefix }}/static/vendor/rickshaw/rickshaw.min.js?v={{ buildVersion }}"></script>
<script src="{{ pathPrefix }}/static/vendor/moment/moment.min.js?v={{ buildVersion }}"></script>
<script src="{{ pathPrefix }}/static/vendor/moment/moment-timezone-with-data.min.js?v={{ buildVersion }}"></script>
<script src="{{ pathPrefix }}/static/vendor/eonasdan-bootstrap-datetimepicker/bootstrap-datetimepicker.min.js?v={{ buildVersion }}"></script>
<script src="{{ pathPrefix }}/static/vendor/bootstrap3-typeahead/bootstrap3-typeahead.min.js?v={{ buildVersion }}"></script>
<script src="{{ pathPrefix }}/static/vendor/fuzzy/fuzzy.js?v={{ buildVersion }}"></script>

<script src="{{ pathPrefix }}static/vendor/mustache/mustache.min.js?v={{ buildVersion }}"></script>
<script src="{{ pathPrefix }}static/vendor/js/jquery.selection.js?v={{ buildVersion }}"></script>
<!-- <script src="{{ pathPrefix }}static/vendor/js/jquery.hotkeys.js?v={{ buildVersion }}"></script> -->
<script src="{{ pathPrefix }}/static/vendor/mustache/mustache.min.js?v={{ buildVersion }}"></script>
<script src="{{ pathPrefix }}/static/vendor/js/jquery.selection.js?v={{ buildVersion }}"></script>
<!-- <script src="{{ pathPrefix }}/static/vendor/js/jquery.hotkeys.js?v={{ buildVersion }}"></script> -->

<script src="{{ pathPrefix }}static/js/graph.js?v={{ buildVersion }}"></script>
<script src="{{ pathPrefix }}/static/js/graph.js?v={{ buildVersion }}"></script>

<script id="graph_template" type="text/x-handlebars-template"></script>

<link type="text/css" rel="stylesheet" href="{{ pathPrefix }}static/css/graph.css?v={{ buildVersion }}">
<link type="text/css" rel="stylesheet" href="{{ pathPrefix }}/static/css/graph.css?v={{ buildVersion }}">
{{end}}

{{define "content"}}
Expand Down
10 changes: 5 additions & 5 deletions pkg/ui/templates/query_menu.html
Original file line number Diff line number Diff line change
Expand Up @@ -4,22 +4,22 @@
<button type="button" class="navbar-toggler" data-toggle="collapse" data-target="#nav-content" aria-expanded="false" aria-controls="nav-content" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<a class="navbar-brand" href="{{ pathPrefix }}">Thanos</a>
<a class="navbar-brand" href="{{ pathPrefix }}/">Thanos</a>
<div id="nav-content" class="navbar-collapse collapse">
<ul class="navbar-nav">
<li class="nav-item"><a class="nav-link" href="{{ pathPrefix }}graph">Graph</a></li>
<li class="nav-item"><a class="nav-link" href="{{ pathPrefix }}stores">Stores</a></li>
<li class="nav-item"><a class="nav-link" href="{{ pathPrefix }}/graph">Graph</a></li>
<li class="nav-item"><a class="nav-link" href="{{ pathPrefix }}/stores">Stores</a></li>
<li class="nav-item dropdown">
<a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Status <span class="caret"></span></a>
<div class="dropdown-menu">
<a class="dropdown-item" href="{{ pathPrefix }}status">Runtime &amp; Build Information</a>
<a class="dropdown-item" href="{{ pathPrefix }}/status">Runtime &amp; Build Information</a>
</div>
</li>
<li class="nav-item">
<a class="nav-link" href="https://thanos.io/getting-started.md/" target="_blank">Help</a>
</li>
<li class="nav-item">
<a class="nav-link" href="{{ pathPrefix }}new/" target="_blank">New UI</a>
<a class="nav-link" href="{{ pathPrefix }}/new/" target="_blank">New UI</a>
</li>
</ul>
</div>
Expand Down
6 changes: 3 additions & 3 deletions pkg/ui/templates/rule_menu.html
Original file line number Diff line number Diff line change
Expand Up @@ -4,11 +4,11 @@
<button type="button" class="navbar-toggler" data-toggle="collapse" data-target="#nav-content" aria-expanded="false" aria-controls="nav-content" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<a class="navbar-brand" href="{{ pathPrefix }}">Thanos</a>
<a class="navbar-brand" href="{{ pathPrefix }}/">Thanos</a>
<div id="nav-content" class="navbar-collapse collapse">
<ul class="navbar-nav">
<li class="nav-item"><a class="nav-link" href="{{ pathPrefix }}alerts">Alerts</a></li>
<li class="nav-item"><a class="nav-link" href="{{ pathPrefix }}rules">Rules</a></li>
<li class="nav-item"><a class="nav-link" href="{{ pathPrefix }}/alerts">Alerts</a></li>
<li class="nav-item"><a class="nav-link" href="{{ pathPrefix }}/rules">Rules</a></li>
<li class="nav-item">
<a class="nav-link" href="https://thanos.io/getting-started.md/" target="_blank">Help</a>
</li>
Expand Down
2 changes: 1 addition & 1 deletion pkg/ui/templates/rules.html
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
{{define "head"}}
<link type="text/css" rel="stylesheet" href="{{ pathPrefix }}static/css/rules.css?v={{ buildVersion }}">
<link type="text/css" rel="stylesheet" href="{{ pathPrefix }}/static/css/rules.css?v={{ buildVersion }}">
{{end}}

{{define "content"}}
Expand Down
2 changes: 1 addition & 1 deletion pkg/ui/templates/stores.html
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
{{define "head"}}
<link type="text/css" rel="stylesheet" href="{{ pathPrefix }}static/css/rules.css?v={{ buildVersion }}">
<link type="text/css" rel="stylesheet" href="{{ pathPrefix }}/static/css/rules.css?v={{ buildVersion }}">
{{end}}

{{define "content"}}
Expand Down
Loading