Html href link to local file

How do I link to a local file in HTML

I have tried the methods suggested in my book and in the questions in a chat group, but I just get a «File Not Found» error. These are typical of what I have tried: Local File and Local File I noticed that the Chrome address bar contains the string: file:///filepath to my HTML file. The above address in quotation marks. I assume that the first part of this is my problem, but I do not know why it is there or how to change it, if that is my problem. Any help would be appreciated.

Clear now that code-formatting is in place — just as the question subject says, he wants to link to a local file. The first one should work (it’s the correct format for specifying a pathname with a Windows drive letter).

1 Answer 1

If the file you are trying to open is in the same directory as the page you can use href=»FILENAME» . If it’s not in the same directory you can either put a slash before the «filepath» for example href=»/Desktop/FILENAME» .

You don’t need to write «file:///filepath». just write the directory and that’s it.

I have tried this in Google Chrome;-

Local File on my computer

but I get back «Your file was not found» and in the search text box of Google Chrome is the string, «file:///C:/Users/krmcc_000/Documents/HTML/»C:/DBAR_Ver.txt» which gives the filepath of my HTML file before the filename that I want (and which is therefore the wrong filepath for the text file that I want to open). From my experience this is a simple and maybe even a stupid problem, but I cannot find what it is.

Here’s a simple fix to your problem. Put your txt file in the same folder or directory as your page. Then simply write href=»filename.txt».

I greatly appreciate all the advice that I have received. I have now tried six different ways to address a local file on my computer, on two different hard drives, using the suggestions given and others, without success. I cannot even see where the problem is, since the HTML below is the main part of this code snippet.

Источник

The right way of setting when it’s a local file

I think the problem is with Firefox. As a security feature they prevent remote files from being able to access local files. There are workarounds, but they seem to be implemented through the browser. More information can be found here: kb.mozillazine.org/Links_to_local_pages_do_not_work

8 Answers 8

By definition, file: URLs are system-dependent, and they have little use. A URL as in your example works when used locally, i.e. the linking page itself is in the user’s computer. But browsers generally refuse to follow file: links on a page that it has fetched with the HTTP protocol, so that the page’s own URL is an http: URL. When you click on such a link, nothing happens. The purpose is presumably security: to prevent a remote page from accessing files in the visitor’s computer. (I think this feature was first implemented in Mozilla, then copied to other browsers.)

So if you work with HTML documents in your computer, the file: URLs should work, though there are system-dependent issues in their syntax (how you write path names and file names in such a URL).

If you really need to work with an HTML document on your computers and another HTML document on a web server, the way to make links work is to use the local file as primary and, if needed, use client-side scripting to fetch the document from the server,

Thank you for this.. I had been racking my head as to why my file links were not working. This needs to be marked as Answer!

Источник

How can I create a link to a local file on a locally-run web page?

The problem is that I’d like the links to function as a shortcut to the file. I’ve tried the following:

. but the first link does nothing and the second link opens the file in Chrome, not VLC.

1. Is there a way to adjust my HTML to treat the links as shortcuts to the files?
2. If there isn’t a way to adjust the HTML, are there any other ways to neatly link to files scattered throughout the hard drive?

My computer runs Windows 7 and my web browser is Chrome.

5 Answers 5

You need to use the file:/// protocol (yes, that’s three slashes) if you want to link to local files.

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.

Источник

How to Properly Reference Local Resources in HTML

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.

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.

What kinds of external resources a html page can reference and how

See http://www.w3schools.com/tags/ for a list of tags

Why can’t I do img src= C:/localfile.jpg ?

It would be a security vulnerability if the client could request local file system files and then use JavaScript to figure out what’s in them.

The only way around this is to build an extension in a browser. Firefox extensions and IE extensions can access local resources. Chrome is much more restrictive.

Cannot open local file — Chrome: Not allowed to load local resource

We use Chrome a lot in the classroom and it is a must to working with local files.

What we have been using is «Web Server for Chrome». You start it up, choose the folder wishing to work with and go to URL (like 127.0.0.1:port you chose)

It is a simple server and cannot use PHP but for simple work, might be your solution:

Loading local file in browser referenced css or js

That’s happening becuause you have tag.

The base URL to be used throughout the document for relative URL addresses.

Since the base URL href is ‘/’, it always start from root. So on local machine it doesn’t find any css/js files, as it would check the files from root i.e. C/D/E drive . And it totally works fine for webserver, since the root would be your public folder.

Is it bad practise to start links with / in html?

It isn’t bad practice. A URL starting with / is merely a relative URL that’s relative the the base path. You’re using it just fine.

Another example usage is when you want to reference a CSS or JavaScript file and you’re deep down into the path.

Then, no matter where the user is on your site, they’d always request http://example.com/scripts/main.js . Where example.com is your site’s domain.

Additionally: Always quote attribute values. ( attribute=»value» and not attribute=value ).

Load resources from relative path using local html in uiwebview

This is how to load/use a local html with relative references.

1. Drag the resource into your xcode project (I dragged a folder named www from my finder window), you will get two options «create groups for any added folders» and «create folders references for any added folders».
2. Select the «create folder references..» option.
3. Use the below given code. It should work like a charm. NSURL *url = [NSURL fileURLWithPath:[[NSBundle mainBundle] pathForResource:@»index» ofType:@»html» inDirectory:@»www»]];

Now all your relative links(like img/.gif, js/.js) in the html should get resolved.

 if let path = Bundle.main.path(forResource: "dados", ofType: "html", inDirectory: "root") webView.load( URLRequest(url: URL(fileURLWithPath: path)) ) 
>

Источник