Async content inside render call

I want to put a dynamic link on a page, but I can’t seem to be able to get it to render properly.

    render() {
        return html`<div>
            <h2 class="mt-xl mb-m">OS Configuration is handled via Cockpit</h2>
            <a href="https//${Endpoint.hostname}:9090">https://${Endpoint.hostname}:9090/</a>

I’m trying to retrieve this url from an endpoint

    public String getHostname() {
        try {
            InetAddress ip = InetAddress.getLocalHost();
            final String fqdn = ip.getCanonicalHostName();
            return fqdn;
        } catch (UnknownHostException e) {
            System.out.println("Failed to get FQDN: " + e.getMessage());
            final String fqdn = "<fqdn>";
            return fqdn;

Has anyone an Idea on how I can resolve this issue? I can’t seem to get around this (my javascript/typescript knowledge is fairly basic)

:thinking: why all the magic if you could just use a relative path in the href?

can I use a relative path to another port?

No. But that’s why you normally add a reverse proxy before applications, so that users don’t have to care about different ports.

you usually do, yes, but in this case this is a link to the management web interface. I’d also like to show a bunch more information about the host system on that page

I guess I’m going to try my luck with vaadin(flow) instead of hilla and hope I don’t have to mess with any javascript