Linking a UNC / Network drive on an html page

HtmlHyperlinkUnc

Html Problem Overview


Just a basic html link question.

I have an intranet setup, and I need to link to some network drives. They are located on drives such as \server_drive\blahblah\doc.docx

Using file:// does not work on either IE8 or Firefox. How can I link to these files?

Html Solutions


Solution 1 - Html

To link to a UNC path from an HTML document, use file:///// (yes, that's five slashes).

> file://///server/path/to/file.txt

Note that this is most useful in IE and Outlook/Word. It won't work in Chrome or Firefox, intentionally - the link will fail silently. Some words from the Mozilla team:

> For security purposes, Mozilla > applications block links to local > files (and directories) from remote > files.

And less directly, from Google:

>Firefox and Chrome doesn't open "file://" links from pages that originated from outside the local machine. This is a design decision made by those browsers to improve security.

The Mozilla article includes a set of client settings you can use to override this behavior in Firefox, and there are extensions for both browsers to override this restriction.

Solution 2 - Html

Setup IIS on the network server and change the path to http://server/path/to/file.txt

EDIT: Make sure you enable directory browsing in IIS

Solution 3 - Html

Alternative (Insert tooltip to user):

<style>
	a.tooltips {
		position: relative;
		display: inline;
	}
	a.tooltips span {
		position: absolute;
		width: 240px;
		color: #FFFFFF;
		background: #000000;
		height: 30px;
		line-height: 30px;
		text-align: center;
		visibility: hidden;
		border-radius: 6px;
	}
	a.tooltips span:after {
		content: '';
		position: absolute;
		top: 100%;
		left: 50%;
		margin-left: -8px;
		width: 0;
		height: 0;
		border-top: 8px solid #000000;
		border-right: 8px solid transparent;
		border-left: 8px solid transparent;
	}
	a:hover.tooltips span {
		visibility: visible;
		opacity: 0.8;
		bottom: 30px;
		left: 50%;
		margin-left: -76px;
		z-index: 999;
	}
</style>
<a class="tooltips" href="#">\\server\share\docs<span>Copy link and open in Explorer</span></a>

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionDougView Question on Stackoverflow
Solution 1 - HtmlMichael PetrottaView Answer on Stackoverflow
Solution 2 - HtmlbryanbcookView Answer on Stackoverflow
Solution 3 - HtmlleusView Answer on Stackoverflow