Links of "href=http://localhost/~~~" in HTML code at server cannot be reached from client

Question

I'm new to HTML world.

I created a "example.html" web page at server,
which contains following a tag links.

...
<nav>
    <ol>
        <li><a href="http://localhost/link1.html">link1</a></li>
        <li><a href="http://localhost/link2.html">link2</a></li>
        <li><a href="http://localhost/link3.html">link3</a></li>
    </ol>
</nav>
...

If I open this "http://localhost/example.html" page on server's web browser and click on links(link1~link3), they work.

The problem is that they DO NOT WORK on client's web browser.

I port-forwarded my server computer and opened "example.html" from client,
through "http://myaddress.com:1234/example.html"

Temporarily, I solved it by changing
every link in server's code, "http://localhost/~~~.html"
to "http://myaddress.com:1234/~~~.html".

However, I want to enable client to access every link in server's code written as "http://localhost/~~~.html"

Is it the problem of port-forwarding? or something else?

Thank you so much.

Answer 1

This should solve the problem, you don't need localhost in your href's. Remove them from your anchor tags.

<nav>
    <ol>
        <li><a href="/link1.html">link1</a></li>
        <li><a href="/link2.html">link2</a></li>
        <li><a href="/link3.html">link3</a></li>
    </ol>
</nav>

OR

Try attaching the port to the localhost href? The client must be running it locally for this to work.

<nav>
    <ol>
        <li><a href="http://localhost:1234/link1.html">link1</a></li>
        <li><a href="http://localhost:1234/link2.html">link2</a></li>
        <li><a href="http://localhost:1234/link3.html">link3</a></li>
    </ol>
</nav>