Need to relatively link to services on the same host and on different ports.

[mc7h]

I run dashy on a server with several other services. Sometimes I connect to Dashy via the LAN IP, sometimes through the Tailnet IP and sometimes through the Tailnet hostname. Rather than the hyperlinks to my services being absolute. I'd like to have them follow the IP / hostname I connect to dashy on.

I attempted to use a link in the format of:

//:8080/bar.html

But, unfortunately, my browser blocked this for security reasons. Is there a mechanism whereby Dashy can render relative links properly.

[lissy93]

Relative links to where, pages within Dashy, or the services you've listed inside Dashy?

[mc7h]

Hey @lissy93 amazing work on Dashy! congrats and thank you!

Ok, let's assume all my services are on one machine - as is Dashy - and the machine's IP is 192.168.1.100.

I have MeTube running on :8081

        title: MeTube
        icon: hl-youtube
        url: http://192.168.1.100:8081/

In Dashy, I don't want to to use an absolute link to 192.168.1.100:8081 because it's also possible to connect to Dashy (and everything else) from the Tailnet IP or Hostname. I need to link to MeTube relative to Dashys host.

[unwieldycat]

Have you figured out a solution to this issue?

[EKolling]

It may be related to this problem. The monitoring mode is showing that the service on port 8080 is offline, but the one on port 8080 is on.

The failure mainly occurs with Issabel.

I don't know if it is a port limitation or a system limitation. All hosts in "internal systems" are on the same machine.

The issabel in the image is working.

[mc7h]

Have you figured out a solution to this issue?

I didn't unfortunately @unwieldycat. I gave up and endeavoured to use my Tailnet IP everywhere.

[emretepedev]

I hit the same problem: Dashy can be opened via different hostnames, but the section item links stay “fixed” and don’t follow the hostname you used to access Dashy.

I couldn’t find a built-in Dashy option for “use current host”, so I solved it client-side by rewriting only links inside Dashy sections after the Vue app renders (SPA), using window.location.hostname + keeping the existing port/path. This avoids touching header/footer/settings links.

link-wizard.js

(() => {
  const currentHost = window.location.hostname;
  const SECTION_SELECTOR = '[class*="section_"]';

  const inSection = (el) => !!el.closest?.(SECTION_SELECTOR);

  const rewrite = (a) => {
    if (!inSection(a)) return;

    const raw = a.getAttribute("href");
    if (!raw) return;

    let u;
    try { u = new URL(raw, window.location.href); } catch { return; }

    if (u.protocol === "https:" && !u.port) return;

    u.hostname = currentHost;
    a.href = u.toString();
  };

  const scan = (root = document) => {
    root.querySelectorAll?.("a[href]")?.forEach(rewrite);
  };

  scan();

  new MutationObserver((muts) => {
    for (const m of muts) {
      for (const n of m.addedNodes) {
        if (n.nodeType !== 1) continue;
        if (n.matches?.(SECTION_SELECTOR) || n.querySelector?.(SECTION_SELECTOR)) {
          scan(n);
        }
      }
    }
  }).observe(document.documentElement, { childList: true, subtree: true });
})();

After build, inject <script src="/link-wizard.js"> into index.html, then start the app

docker.compose.yml

services:
  dashy:
    image: lissy93/dashy
    container_name: dashy
    restart: unless-stopped
    ports:
      - 8080:8080
    volumes:
      - ./user-data:/app/user-data
      - ./user-data/link-wizard.js:/app/public/link-wizard.js:ro
    environment:
      - NODE_ENV=production
    command: [
        "/bin/sh",
        "-c",
        "
        set -eu;
        yarn build --mode production;
        node -e \"const fs=require('fs'); const p='/app/dist/index.html'; let h=fs.readFileSync(p,'utf8'); const t='<script src=\\\"/link-wizard.js\\\"></script>'; if(!h.includes(t)){ fs.writeFileSync(p, h.replace(/<\\/body>/i, '  '+t+'\\n</body>')); }\";
        exec yarn start
        ",
      ]

Result:

• Open Dashy via http(s)://<hostname>:<dashy_port> → item links go to http(s)://<hostname>:<app_port>
• Open Dashy via http(s)://<hostname>.<tailnet>.ts.net:<dashy_port> → item links go to http(s)://<hostname>.<tailnet>.ts.net:<app_port>