I have a html file with manifest defined.
<!DOCTYPE html>
<html manifest="manifest.appcache" type="text/cache-manifest">
<head>
<title>Sample</title>
</head>
<body>
Sample app
</body>
</html>
and a manifest file like this:
CACHE MANIFEST
*
usually, firefox should prompt me to store the files in the browser chache?
its not prompting and also nothing is getting cached, when i look into the dom, using firebug's DOM tab.
Can anybody tell me what is happening here or am i missing something?
The manifest file must be served up with the special mime-type text/cache-manifest. If not the browser will probably not take the manifest file into account. So you better set up a local http server and configure the right mime type. For apache you can add this to your .htaccess
AddType text/cache-manifest .manifest
Read the following article for more details: Testing Your Offline Applications
Related
I was following the steps and wrote a demo HTML. Here are the steps in the README of https://github.com/commonmark/commonmark.js#commonmarkjs :
For client-side use, you can do make dist to produce
a standalone JavaScript file js/dist/commonmark.js,
suitable for linking into a web page, or fetch the latest
from
https://raw.githubusercontent.com/jgm/commonmark.js/master/dist/commonmark.js,
or bower install commonmark.
Here is my demo HTML.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="https://raw.githubusercontent.com/jgm/commonmark.js/master/dist/commonmark.js"></script>
<script>
window.onload = function() {
console.log(commonmark)
}
</script>
<body></body>
</html>
Here is a JSFiddle URL for my demo: https://jsfiddle.net/y3xohp7x/
I saved this HTML locally in a file named foo.html and opened this local file with Firefox 55.0.1.
But if I load it with Firefox 55.0.1, I get the following errors in the console.
Loading failed for the <script> with source “https://raw.githubusercontent.com/jgm/commonmark.js/master/dist/commonmark.js”. foo.html:5
ReferenceError: commonmark is not defined foo.html:9:5
Questions:
Why does this error occur?
How can I resolve this error without having to copy commonmark.js to the local filesystem?
Is it a bug in the commonmark.js README documentation that I quoted above or is it an error in my understanding of the documentation?
Edit
Actually, there apparently is a way to do this for github content in particular: https://rawgit.com/
This website gives you a link to a version of the script that will be served with the correct MIME-type.
So this should load the script properly for you:
<script type="application/javascript" src="https://cdn.rawgit.com/jgm/commonmark.js/master/dist/commonmark.js"></script>
https://jsfiddle.net/w1uvq59r/
Original Answer
The reason is that the script source is sent back with the headers:
"Content-Type": "text/plain"
"X-Content-Type-Options": "nosniff"
The latter header prevents the browser from executing the script due to the fact that the content-type is not executable, like "application/javascript". Which means unfortunately there is really no way to get the script to load remotely. Here is a thread with more information on a similar problem.
The only solution, as far as I can tell, is to load it locally, like so:
<script type="application/javascript" src="path/to/the/file.js"></script>
Sorry, I don't have a good understanding of the web, but:
When you load in an external script file into an html document, where does it hold or cache that file? It doesn't put it in the index.html file.
<html>
<head>
<script src="name_of_file"></script>
</head>
.....
I ask because I'm working with node.js, and I'm wondering if I list an external script file under my index.html page, I can send the javascript file to the client.
the browser will recognize the "src"="http://xxx/xx.js" of your script tag,and check if the resources(identified with URI:"http://xxx/xx.js") has cached in browser local cache dir(every browser has its own dir)
if the file exist and cache is not expired,the browser will directly load this file,otherwise browser will download the script file,and execute them when download finish.
This question has no good answer. A JavaScript program can be located anywhere on a server, It's just linked to with <script src=SCRIPT></script> Where SCRIPT is the relative or absolute path to the .js file. Check out This site for more info.
It's wherever the file is being served from. With what you've given and default setup, the file will be in the same directory as your index.html file
For some reason my html file's request for my jquery.js file fails, however when I enter that exact url into a new tab in the browser, I get the exact jquery.js file I am trying to get when the website loads.
My code is as such:
<script src="js/jquery.js"></script>
and my website is here. If you append jquery.js to the root, you will see the exact file.
Can anyone explain why the file isn't properly retrieved when the website loads?
Any help is greatly appreciated.
At the beginning of your HTML file is this:
<!DOCTYPE html>
<html manifest="appcache.appcache">
The appcache.appcache refers to the file appcache.appcache whose content is:
CACHE MANIFEST
# V1.65 1-18-2013 10:15 PM
# cache
index.html
about.html
services.html
contact.html
css/signika.css
css/mq.css
css/index.css
css/about.css
css/services.css
css/contact.css
assets/signika_400.woff
assets/signika_600.woff
js/html5.js
js/index.js
js/mq.js
js/services.js
mail.php
images/chicken.png
images/salad.png
images/soup.png
images/steak.png
images/wontons.png
As you can see jQuery.js is not there. I suggest you to add js/jQuery.js into a new line and try again.
I figured this out by:
Running the Fiddler software side by side with Chrome (on Windows).
Loading your website in Chrome with Developer Tools (Ctrl+Shift+I on Windows, Command ⌘+Option ⌥+I on Mac), then go to the Network tab.
Then I see that Chrome loads appcache.appcache from the second time onwards and there's an error when loading jQuery.js.
The manifest attribute refers to the HTML5 cache manifest file.
Tutorial:
http://www.html5rocks.com/en/tutorials/appcache/beginner/
More references:
http://caniuse.com/#search=manifest (browser compatibility)
http://en.wikipedia.org/wiki/Cache_manifest_in_HTML5 (wiki)
https://www.google.com/search?q=html5+manifest
It's probable that the HTML file containing the script header in question is not in the "root" but perhaps in the same JS folder or somewhere else.
So technically this should work:
<script src="/js/jquery.js"></script>
Just keep in mind that this path is relative.
I've installed CentOS and LAMP on an old desktop at home to practice system administration and webadmining, but I'm running into a strange problem.
I have a webpage that's no more than:
<!DOCTYPE html>
<html
<head>
<script type="text/javascript" src="test.js"></script>
</head>
<body>
</body>
</html>
The chrome console is telling me that the request for test.js is failing. When I right click the link it gives and open it in a new tab, it correctly shows.
Is there a setting in apache that I need to set for this to work?
edit: Only thing in the logs is about the favicon
edit:
Some additional details: I'm accessing via the local ip of the machine, external script and stylesheet requests work, and all the files are in the same directory.
edit: Using fiddler, it looks like chrome isn't even sending out the request for the files.
edit: The response headers for the webpage include "Connection: close"
Make sure that file with that HTML code, and test.js are in the same directory.
I suspect that's the problem.
If you double click file on your system it's not opened via apache.
If you are opening html by
http://localhost/test.html
Then chrome will search to test.js in
http://localhost/test.js
I'm trying to execute a javascript file in my browser but the code is displayed and not actually executed. I'm using firefox and I made sure javascript is enabled. I tried using a .js extension and .shtml and both just display the code. The file is located in my apache htdocs folder and it's version 2.2.
I'm trying to run this hello world code.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<script type="text/javascript" src="helloworld.js"></script>
</head>
<body>
<p id="hello"></p>
</body>
</html>
Here's the javascript
document.getElementById('hello').innerHTML = 'hello world';
Any suggestions?
You have no element with the ID of ex.
With the HTML you've shown, your line should be:
document.getElementById('hello').innerHTML = 'hello world';
See now that <p> tag has the id="hello" -- how would a call to getElementById('ex') be able to find that?
EDIT
Working JSFiddle example
try something like this
<html>
<head>
<script type="text/javascript" src="helloworld.js"></script>
</head>
<body onload="onload1()">
<p id="hello"></p>
</body>
</html>
helloworld.js
function onload1(){
document.getElementById('hello').innerHTML = 'hello world';
}
Save the above code as .htm or .html. Your server is probably not configured to use SSI (.shtml extension).
You said you saved it as .js and as .shtml, this is probably where you have gone wrong. .js files will not display properly when opened directly by the browser, as the browser is not intended for displaying JavaScipt, thus you must use a file type that is intended for HTML. The .shtml extension is for HTML, however it is only used with servers using SSI (Server Side Includes), so if the server does not use SSI it will not work.
Usually you will see code when the mime type is wrong. The mime type is how the server tells the browser what kind of file it is sending http://en.wikipedia.org/wiki/Internet_media_type. The server sends the mime type, which it determines by looking a the files extension, or in some cases certain parts of the file (and server side code can adjust the mime type as well). The server will give files with the .htm and .html extension the HTML mime type, but .js will not have that type. The .shtml file will only be given the HTML mime type if the server uses SSI. So when the browser gets those files it will intemperate them as plain text. This is why you see the code.
So either change the extension to .htm or .html, or enable SSI on the server (or ensure it is configured to work in that directory).
As a side note, your JS will not do anything as there is no element with the ID 'ex', however that should not produce the problem of seeing code. It will however give you trouble down the line.