How to specify a local file within html using the file: scheme?

Question

I'm loading a html file hosted on the OS X built in Apache server, within that file I am linking to another html file in the same directory as follows:

<a href="2ndFile.html"><button type="submit">Local file</button>

This works. However (for reasons too lengthy to go into) I am experimenting using the file: scheme instead, however I cannot get anything to work. Here is how I am re-writing the above line using file:

<a href="file://192.168.1.57/~User/2ndFile.html"><button type="submit">Local file</button>

(192.168.1.57 is my current IP address)

Changing it to the following does also not work:

<a href="file://Name-Of-MacBookPro/~User/2ndFile.html"><button type="submit">Local file</button>

But the file cannot be found, how should it be specified using the file: scheme?

Answer 1

The file: URL scheme refers to a file on the client machine. There is no hostname in the file: scheme; you just provide the path of the file. So, the file on your local machine would be file:///~User/2ndFile.html. Notice the three slashes; the hostname part of the URL is empty, so the slash at the beginning of the path immediately follows the double slash at the beginning of the URL. You will also need to expand the user's path; ~ does no expand in a file: URL. So you would need file:///home/User/2ndFile.html (on most Unixes), file:///Users/User/2ndFile.html (on Mac OS X), or file:///C:/Users/User/2ndFile.html (on Windows).

Many browsers, for security reasons, do not allow linking from a file that is loaded from a server to a local file. So, you may not be able to do this from a page loaded via HTTP; you may only be able to link to file: URLs from other local pages.