Cross-browser link to file on local system
Links to local files on pages that were retrieved via HTTP(S) are deliberately disabled in Mozilla/Firefox, because they can be a security risk, and have been used in attacks in the past.
You can override this behaviour, however. For details, see this article in MozillaZine.
How can I create a link to a local file on a locally-run web page?
You need to use the file:///
protocol (yes, that's three slashes) if you want to link to local files.
<a href="file:///C:\Programs\sort.mw">Link 1</a>
<a href="file:///C:\Videos\lecture.mp4">Link 2</a>
These will never open the file in your local applications automatically. That's for security reasons which I'll cover in the last section. If it opens, it will only ever open in the browser. If your browser can display the file, it will, otherwise it will probably ask you if you want to download the file.
You cannot cross from http(s) to the file protocol
Modern versions of many browsers (e.g. Firefox and Chrome) will refuse to cross from the http(s) protocol to the file protocol to prevent malicious behaviour.
This means a webpage hosted on a website somewhere will never be able to link to files on your hard drive. You'll need to open your webpage locally using the file protocol if you want to do this stuff at all.
Why does it get stuck without file:///
?
The first part of a URL is the protocol. A protocol is a few letters, then a colon and two slashes. HTTP://
and FTP://
are valid protocols; C:/
isn't and I'm pretty sure it doesn't even properly resemble one.
C:/
also isn't a valid web address. The browser could assume it's meant to be http://c/
with a blank port specified, but that's going to fail.
Your browser may not assume it's referring to a local file. It has little reason to make that assumption because webpages generally don't try to link to peoples' local files.
So if you want to access local files: tell it to use the file protocol.
Why three slashes?
Because it's part of the File URI scheme. You have the option of specifying a host after the first two slashes. If you skip specifying a host it will just assume you're referring to a file on your own PC. This means file:///C:/etc
is a shortcut for file://localhost/C:/etc
.
These files will still open in your browser and that is good
Your browser will respond to these files the same way they'd respond to the same file anywhere on the internet. These files will not open in your default file handler (e.g. MS Word or VLC Media Player), and you will not be able to do anything like ask File Explorer to open the file's location.
This is an extremely good thing for your security.
Sites in your browser cannot interact with your operating system very well. If a good site could tell your machine to open lecture.mp4 in VLC.exe, a malicious site could tell it to open virus.bat in CMD.exe. Or it could just tell your machine to run a few Uninstall.exe files or open File Explorer a million times.
This may not be convenient for you, but HTML and browser security weren't really designed for what you're doing. If you want to be able to open lecture.mp4 in VLC.exe consider writing a desktop application instead.
Is there any cross-browser compatible way to save a web URL to a user's desktop?
Due to security, the browser is very limited with its interactions with the native operating system.
Unfortunately, what you are asking is not possible. JavaScript is run in a sandbox environment and is not executed on the OS, so interactions between a website and a local computer is not possible in that manner.
The best you can do it drag and drop the hyperlink, which is supported by Windows, however there is no customization you will be able to do to the link once it appears on the end-user's desktop. The link will be created using the text provided in the anchor tag, and it will link to the url provided in the href.
Grabbing the icon from the URL bar at the top is a supported interaction between the browser application and Windows and doesn't extend the logic to the web page to allow the same.
Link to file on different server
What you are doing is disabled by design. This sort of link to a local file will work in some browsers as long as the HTML is also called from a local file (ie file:///pageContainingLink). If not, it's a security vulnerability. It won't work at all in webkit based browsers.
See <A>nchor Link to Local File? (<a href='file:///{path}'>DEAD LINK</a> not working in FireFox but in IE)
And Cross-browser link to file on local system
If you want to get this to work, you'll need the other server to be a web-server too so that you can link to http://intranet2/fileYouWant.pdf
HTML links to local network shares
In general, this is disabled because it is a security risk. See also this question:
Cross-browser link to file on local system, and the link provided by sleske to here.
Cross origin requests are only supported for HTTP. error when loading a local file
My crystal ball says that you are loading the model using either file://
or C:/
, which stays true to the error message as they are not http://
So you can either install a webserver in your local PC or upload the model somewhere else and use jsonp
and change the url to http://example.com/path/to/model
Origin is defined in RFC-6454 as
...they have the same
scheme, host, and port. (See Section 4 for full details.)
So even though your file originates from the same host (localhost
), but as long as the scheme is different (http
/ file
), they are treated as different origin.
Related Topics
HTML5 Alternative to Flash-Based Zeroclipboard for Safe Copying of Data to Clipboard
Valid Order for Attributes of Input Type Tag
Progress Bar with HTML and CSS
Prevent a Flex Items Height from Expanding to Match Other Flex Items
Bootstrap Row Class Contains Margin-Left and Margin-Right Which Creates Problems
Slant The Top of a Div Using CSS Without Skewing Text
Texture Splatting with Three.Js
How to Reverse Flexbox Direction on Wrap to Achieve "Snake Wrap"
How to Use an Image from My Local File System as Background in HTML
Centering a Div Between One That's Floated Right and One That's Floated Left
Angular Performance: Dom Event Causes Unnecessary Function Calls
Getting Rid of Bullet Points from <Ul>
How to Make HTML Open a Hyperlink in Another Window or Tab
CSS Changes Are Not Getting Reflected. Why
CSS 100% Height, and Then Scroll Div Not Page