I've built a simple page to test the cache-control and I'm getting confused by the results.
The page is just
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Website teste</title>
<meta http-equiv="cache-control" content="no-cache">
</head>
<body>
<div>Hello World</div>
<script>
setTimeout(function () {
window.location.reload()
}, 10000)
</script>
</body>
</html>
If I do a hard-refresh the cache-control is what expected
but the next refresh the cache-control changes to max-age=0
And shouldn't the result be a 304 (Not Modified) instead a 200 (OK)
This sample site is running on VisualStudio (IIS)
The http-equiv attribute of the meta element is defined in the HTML standard. Note that:
The http-equiv attribute is an enumerated attribute. The following table lists the keywords defined for this attribute...
cache-control is not one of the listed values, and thus this directive has no effect.
Your assumption isn't unreasonable, though; in earlier versions of the standard it was suggested that servers could create headers based on this element:
HTTP servers may read the content of the document <HEAD> to generate
header fields corresponding to any elements defining a value for the
attribute HTTP-EQUIV. NOTE - The method by which the server extracts document meta-information is unspecified and not mandatory.
I have no idea whether any servers actually did this, though.
Finally, note that the Cache-Control header you're looking at in the developer tools is a request header, not a response header, and thus has nothing to do with any of this. It's something that browsers often add to the request on refresh to make sure they don't get served cached content.
Related
I currently put this <meta cache-control: public ETag: "v019" />
in the <head> just under the <title>, but keep getting Errors in the W3 validator.
What is the format and where do I put this in my HTML5 file?
An ETag isn't useful unless it is in a real HTTP header. It shouldn't be in your HTML document at all.
That said, the syntax for an HTML meta tag with a simulation of an HTTP header is:
<meta http-equiv="cache-control" value="public">
<meta http-equiv="ETag" value=""v019"">
cache-control and ETag are not accepted values for it in HTML 5. You would need to be using HTML 4 or earlier (although it would still be pointless).
If I have a CSP meta tag (as opposed to using an HTTP header), like so:
<meta http-equiv="Content-Security-Policy" content="default-src https://cdn.example.net; child-src 'none'; object-src 'none'">
... and then I go into developer tools and remove that node, would the browser act as though it was never provided, or would the fact that it was added at all be persistent no matter what?
I'm asking because I want to know if I should use an HTTP header (which can't be modified), or if it's safe to just use this meta tag.
No. In the Content Security Policy spec it says:
Note: Modifications to the content attribute of a meta element after the element has been parsed will be ignored. [own markup]
I would read that as: "Once the meta tag's CSP is parsed, modifications to the tag (including deletions) will not effect the CSP".
But also note KayakinKoder's answer and make sure to place the meta tag at the very top of the head element:
Authors are strongly encouraged to place meta elements as early in the document as possible, because policies in meta elements are not applied to content which precedes them. In particular, note that resources fetched or prefetched using the Link HTTP response header field, and resources fetched or prefetched using link and script elements which precede a meta-delivered policy will not be blocked.
I definitely wouldn't put it in html. Even if you tell browsers to never cache thing X, some will eventually screw around and cache thing X "to be helpful". Lets say you want to change your CDN from example.net to differentcdn.com in the future; if any browsers have cached your CSP, your site will be broken. Or even worse, you accidentally edit the CSP CDN section to "exEmple.net" and deploy; browsers cache this, and your site is completely broken. We've had some users browsers cache 302 (temporary..) redirects that were clumsily put in an .htaccess file rather than completely server-controlled http.conf, what a nightmare; I don't trust browsers to do what they are supposed to do on anything extremely important that would break our app.
As far as I'm aware, headers are never cached.
Finally, I would recommend looking into Google's strict CSP 3: https://csp.withgoogle.com/docs/strict-csp.html
It looks like this Content-Security-Policy meta tag is "protected", i.e. the browser remembers its value even when it is removed via dev tools.
You can simply try it with this simple example:
index.html
<!DOCTYPE html>
<html lang="en">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Security-Policy" content="default-src self;">
Then open dev tools and type in:
fetch('http://example.com')
You will see something like:
VM345:1 Refused to connect to 'http://example.com/' because it violates the following Content Security Policy directive: "default-src self 'mocky.io'". Note that 'connect-src' was not explicitly set, so 'default-src' is used as a fallback.
Let's try it with removing that particular meta tag
document.querySelector("[http-equiv='Content-Security-Policy']").remove()
fetch('http://example.com')
You will still see the same error.
I tried it in the most recent versions of chrome and firefox. Maybe some least known browsers or lower versions will react differently. Unfortunately, I couldn't find more info about it but I don't see any particular reason for not using it.
I need to add response headers like X-Frame, Cache-control, Pragma etc directly into the html code, may be, using attributes in html elements?
It is for help pages which are directly coming from a directory via href link.
Is there any way to add headers to these htmls?
You can use meta to replicate some of these. Normally not the ideal solution, but look into the http-equiv attribute of meta tags. I believe a lot of these have been deprecated in newer browsers.
Examples:
<meta http-equiv="Cache-control" content="no-cache"/>
<meta http-equiv="X-Frame-Options" content="sameorigin"/>
<meta http-equiv="pragma" content="no-cache"/>
In short: no, you cannot. HTML files are the body of an HTTP response; the headers must come from the server. Anything you could embed in the HTML file would just become part of the body.
You can add something like this, if php execution is enabled on your web server:
<?php
http_response_code(your_response_code)
?>
rest-of-your-html-code
This will execute a php script that will set the response code.
I am reading a Servlet "HellowWorld" tutorial. The servelet is defined in a HelloWorldServelet.java class. Super simple to output "Hell world" message to the client request. The only html file is "index.html" below. I don't understand how the meta tag works. As I run the application in the web server, it automatically this page with the URL:
http://localhost:8080/helloworld/HelloWorld
How the attributes "http-equiv" and "content" work together with the servelet?
<html>
<head>
<meta http-equiv="Refresh" content="0; URL=HelloWorld">
</head>
</html>
The Refresh meta-tag automatically redirects the browser to the URL given after the specified amount of time.
Without seeing the tutorial you are using, I can't imagine why you would need to use it for your task.
https://en.wikipedia.org/wiki/Meta_refresh
"http-equiv" and "content"
they are used for adding message headers in http response .
For example http-equiv can be used to refresh the page.
if you specify something like this
<meta http-equiv="refresh" content="45">
you are instructing browser to refresh in every 45 seconds.
Other than refresh,you can use it to set cookies and etc.
Here it the start of my HTML5 web application:
<!DOCTYPE html>
<html>
<head>
<meta content='text/html; charset=utf-8' http-equiv='Content-Type'>
Is the meta content tag needed. Is HTML / UTF-8 a default?
I just removed the namespace in the html tag as this is not needed.
Was wondering if I can remove the meta tag here.
UTF-8
Yes; typically this is simply <meta charset='utf-8'> in HTML5, since the actual content-type is always determined by the corresponding HTTP header instead:
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
You can continue using what you already have, but the content-type must be text/html followed by the character encoding for it to validate as HTML5. For simplicity, just go with the new recommended syntax. See the W3C HTML5 spec for details.
There are two distinct issues here: the content type (media type, MIME type), and the character encoding (“charset”). For the latter, see <meta charset="utf-8"> vs <meta http-equiv="Content-Type">. Note that there is no universal default for character encoding in HTML, and a meta tag is just one way of specifying the encoding and may be trumped by HTTP headers or BOM.
But the title of the question asks “Does HTML5 require content-type to be set?”, and the answer is that it does not require it to be set in the HTML document and it cannot be set in the HTML document. If some software parses a meta tag and inteprets it as having a specific meaning, it has already decided to process the document as an HTML document.
General Internet protocols specify how clients are informed of content types (in HTTP headers, e-mail message headers, etc.), and for an HTML document transmitted over HTTP, the server should announce the content type as text/html (or as a content type defined for genuine XHTML, if you want Draconian XML error processing and other serious consequences). Without such information, browsers will have to guess the content type, and they may guess wrong