| ▲ | Contentlesshtml – An HTML page served entire in HTTP headers(5snb.club) |
| 42 points by dddnzzz334 10 months ago | 19 comments |
| |
|
| ▲ | ruthmarx 10 months ago | parent | next [-] |
| Why isn't it being assembled as HTML that can be viewed in document inspector or via viewing source? Ht HTML that extensions inspect shows up. If it is assembled to be rendered, why isn't it available anywhere else in the browser to view? |
| |
| ▲ | jansan 10 months ago | parent [-] | | It's using CSS, specifically the `content` property. You can use developer tools in Firefox to inspect it. | | |
| ▲ | kroltan 10 months ago | parent | next [-] | | And to spell it out: - Stylesheet encoded as base64 in the Link header; - Browsers always implicitly have at least the html and body tags; - CSS cannot create new elements, but it does get 2 free pseudo-elements per actual element, ::before and ::after; - CSS can set textual content for pseudo-elements; So, it sets content to a pseudo element of an implicitly created tag, that's why the page is so minimal. (Well, it could be up to 4 times as complicated I think, by using the other 3 pseudo-elements. Or cheat by using a big SVG as a background-image with more complex contents, but then you start running into header size limits and whatnot) | |
| ▲ | ruthmarx 10 months ago | parent | prev [-] | | ah, thanks! |
|
|
|
| ▲ | cryptonym 10 months ago | parent | prev | next [-] |
| Doesn't work on Chrome |
| |
|
| ▲ | xnx 10 months ago | parent | prev | next [-] |
| Blank rickroll site from 3 years ago using same technique: https://github.com/PwnFunction/Blank-Rick-Roll |
|
| ▲ | selcuka 10 months ago | parent | prev | next [-] |
| TL; DR: It uses the HTTP link header [1] in a way that only works on some browsers: link <data:text/css;charset=utf-8;base64,KiB7CiAgICBiYWNrZ3JvdW5kLWNvbG9yOiBjeWFuOwp9Cgpib2R5OjphZnRlciB7CiAgY29udGVudDogIkhpISBUaGlzIGlzIHNlcnZlZCBlbnRpcmVseSBpbiB0aGUgSFRUUCBoZWFkZXJzISBQcmV0dHkgY29vbCwgaHVoPyI7CiAgZm9udC1zaXplOiAyNHB4OwogIGZvbnQtZmFtaWx5OiBjdXJzaXZlOwogIHRleHQtc2hhZG93OiAycHggMnB4IDJweCBwaW5rOwp9Cg==>; rel="stylesheet"
which is, when base64-decoded: * {
background-color: cyan;
}
body::after {
content: "Hi! This is served entirely in the HTTP headers! Pretty cool, huh?";
font-size: 24px;
font-family: cursive;
text-shadow: 2px 2px 2px pink;
}
[1] https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Li... |
|
| ▲ | Alifatisk 10 months ago | parent | prev | next [-] |
| How much can one pack into the header? Is there a limit? |
| |
| ▲ | maxmcd 10 months ago | parent | next [-] | | I think if you go above 32kb for the size of all headers you'll start to see things breaking in various libraries and services. | |
| ▲ | jalk 10 months ago | parent | prev [-] | | What’s the point besides a curious hack? | | |
| ▲ | afavour 10 months ago | parent | next [-] | | Does there need to be one? It raises awareness of the headers used, even if they’re used weirdly here. | |
| ▲ | tgma 10 months ago | parent | prev | next [-] | | It does not really work on all browsers, but I can imagine scenarios where in some network middleware you have some dynamic control over headers but don't have control over the content, so that might be once place something like this could be useful. | |
| ▲ | cryptonym 10 months ago | parent | prev [-] | | One could leverage this as a clever way to update something on a page without redownloading it. Or from a proxy, without having to decompress & process body.
Unfortunately support is limited to Firefox, so it's useless. |
|
|
|
| ▲ | bhhaskin 10 months ago | parent | prev | next [-] |
| Isn't every webpage served by http headers? =P |
|
| ▲ | 10 months ago | parent | prev [-] |
| [deleted] |
