Mini dashboard does not work on meilisearch running on sub routes
bidoubiwa opened this issue · comments
Description
see issue
The mini dashboard only works when MeiliSearch is running at the root of it's domain.
For example if the instance is hosted here http://mymeili.com
then the dashboard will show correctly
If for example the dashboard is in a sub route like http://myapp.com/api
then the mini dashboard does not show up.
For example http://104.248.162.211/api/. It is a white page.
But if you curl on the same URL
➜ ~ curl http://104.248.162.211/api/health
{"status":"available"}%
Meaning that while the mini dashboard does not show up, meilisearch is still running correctly.
The problematic line is this one in src/App.js
:
export const baseUrl =
process.env.REACT_APP_MEILI_SERVER_ADDRESS ||
(process.env.NODE_ENV === 'development'
? 'http://0.0.0.0:7700'
: window.location.origin)
window.location.origin
takes the root of the domain whereas href takes the current position:
The problem with changing to href
is that now the mini dashboard is accessible on every sub-route on not only the root of the meilisearch instance.
example nginx config to reproduce:
server {
listen 80 default_server;
listen [::]:80 default_server;
server_name _;
location /api/ { # trailing slash is important
proxy_pass http://127.0.0.1:7700/; # trailing slash is important
}
}
Expected behavior
The mini dashboard should show up at the root of where meilisearch is running
Current behavior
It only works when meilisearch is at the root
Environment (please complete the following information):
- Meilisearch version: v0.25.2
Related meilisearch/product#295
Do we have any news on this? It looks like a bug fix more than a new feature to me.
The problem with changing to href is that now the mini dashboard is accessible on every sub-route on not only the root of the meilisearch instance.
@bidoubiwa This is the most direct solution but do we have another one at hand?
I'm not sure this is something we want as a curl on /search
I think would return the HTML page. Though I'm sure there is a solution I don't have the required knowledge to play with path and redirections.
Not sure yet what the nginx equivalent is, but I managed to solve the problem with Caddy by matching the Referer
header.
If the request's Referer
header contains /search/
, it will strip /search
from the path and effectively serve css js etc. from root.
route {
##### Ensure trailing slash
redir /search /search/
##### Serve Meilisearch from a subfolder, by matching the path
@meilisearch path /search/*
##### Serve assets from the subfolder, by matching the HTTP Referer header
@meilisearch_assets header Referer */search/*
handle @meilisearch {
uri strip_prefix /search
header X-Forwarded-Proto {scheme}
header X-Forwarded-Host {host}
reverse_proxy meilisearch:7700
}
handle @meilisearch_assets {
uri strip_prefix /search
header X-Forwarded-Proto {scheme}
header X-Forwarded-Host {host}
reverse_proxy meilisearch:7700
}
}
I have adopted @firstred’s answer for nginx:
location /search {
rewrite /search/(.*) /$1 break;
proxy_pass http://127.0.0.1:7700;
}
location / {
if ($http_referer ~* ^.*/search/.*$ ) {
proxy_pass http://127.0.0.1:7700;
}
}
Thanks a lot for your answers and suggestions 🙏
I'll now close this issue as this can be fixed with the nginx configuration.
Have a nice day ☀️
Great! @urbantrout thanks a lot for sharing the nginx version!