bull-board
bull-board copied to clipboard
felixmosh
Bull stuck into 'Loading' cause missing .js file
When I develop in my local machine without docker it's work seamless. But when I move to production server, Bull-board is stuck on loading, After I inspect, I know cause I have API Gateway inside my production server
Here I attached the screenshot below I access with http://mydomain.com:8000/serviceName/queue https://pasteboard.co/HDl7oBQ67cbS.png I think bull cant resolve the asset file https://pasteboard.co/0YtAQp4KY4IU.png
Btw I am using bull-board/koa I mean there is an API for change the static file routes
static monitor(basePath: string): KoaAdapter {
const serverAdapter = new KoaAdapter();
serverAdapter.setBasePath(basePath);
createBullBoard({
queues: Array.from(queuesList.values()).map(
(queue) => new BullAdapter(queue)
),
serverAdapter: serverAdapter,
});
return serverAdapter;
}
I already look into the source file, but cant find one that suitable for my use case https://pasteboard.co/Nnx5fNp3zQUz.png
Hi, thank you for reporting this issue.
Looks like it is related to your setup. Let's debug it.
- Do you have the static assets inside the docker?
- The html contains
<base>tag, what its value? - When you call
serverAdapter.setBasePath(basePath);, what is the value ofbasePath? - What is the path that the board mounted in?
I have the same issue when using the bull-dashboard and the dashboard is behind a gateway. I am using express adapter.
It works fine if I directly access dashboard on my local environment (http://localhost:3000/v1/xxxx/admin/queues/).
But when accessing the same through gateway, I get Loading... page. (http://localhost:9000/dashboard/v1/xxxx/admin/queues). I have a rule in Gateway that will replace the path /dashboard with '' (empty string).
@yogeshattwic this issue is not related to bull-board, you probably didn't configured your reverse proxy properly, therefore, static assets are not loading.
@felixmosh - I have similar set up for swagger and that is working fine. This is what I see in my html response when I access http://localhost:9000/dashboard/v1/xxxx/admin/queues
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no" />
<meta name="robots" content="noindex" />
<base href="/v1/xxxx/admin/queues" />
<title>Bull Dashboard</title>
<link rel="alternate icon" type="image/png" href="/v1/xxxx/admin/queues/static/favicon-32x32.png" />
<link rel="icon" type="image/svg+xml" id="fav-logo" href="/v1/xxxx/admin/queues/static/images/logo.svg" />
<link href="https://fonts.googleapis.com/css2?family=Ubuntu:wght@300;400;500&display=swap" rel="stylesheet" />
<link href="/v1/xxxx/admin/queues/static/main.d479e4cc3d1250c7da62.css" rel="stylesheet" />
</head>
<body>
<div id="root">Loading...</div>
<script defer="defer" src="/v1/xxxx/admin/queues/static/vendor.c901a01171d59631f7e1.js"></script>
<script defer="defer" src="/v1/xxxx/admin/queues/static/main.73d0a128b9c824de66ae.js"></script>
</body>
</html>
getting 404 for loading all those static assets files. You are right that this is not bull-board issue. I am missing something trivial in my setup.
@felixmosh - I am using bull-board api and express version 3.11.1. Even though I have not resolved my main issue with this, I figured an alternative way since my bull dashboard is inside a service that is running in Kubernetes pod. I was able to use port-forward to access the service in pod.
@yogeshattwic are you using koa? if not, please open a new issue.
Please try to update bull-board to v4.2.2.
For me, it was the fact that I had
serverAdapter.setBasePath('/api/admin/queues');
and then in my server file
app.use('/admin/queues', buildBullBoard())
Having these routes be mismatched caused the asset url requests to go to the incorrect address.
