DNS prefetching of subdomains - html

Do I have to prefetch a subdomain separately?
E.g. when I have <link rel="dns-prefetch" href="//example.com"> do I need an additional tag for //static.example.com as well?

I've made the following test: first created simple HTML page
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="dns-prefetch" href="//example.com/">
</head>
<body>
Test link
Test link 2
</body>
</html>
For the domain and subdomain for which I own dns nameserver. Then I cleaned dns cache and opened this page in firefox private window. I observed in the logs of my dns nameserver that only request for "example.com" was made and no requests for subdomains.
Then I changed the page as follows:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="dns-prefetch" href="//example.com/">
<link rel="dns-prefetch" href="//sub.example.com/">
</head>
<body>
Test link
Test link 2
</body>
</html>
Again cleared dns cache and opened this page in firefox private window. Now I observed that dns requests we made for both domain and it's subdomain.
So I can conclude that yes - you have to prefetch subdomains separately.

You have to prefetch every subdomain separately.
It is how DNS works. You ask for name, it answers back, it knows nothing about "subdomains" it's just a name.
nslookup google.com gives you answers for google.com only, no subdomains.
nslookup www.google.com gives www.google.com only, no top-level domains.

Related

Unknown Error on embeding Stripe Pricing Table

I have an error when I try to embed a stripe princing table on a web page.
When I copy the code provided by stripe during the cration of the pricing table and refresh the page it gives me unknown error. I used the HTML method to embed the pricing table.
Here my code :
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test</title>
</head>
<body>
<script async src="https://js.stripe.com/v3/pricing-table.js">
</script>
<stripe-pricing-table pricing-table-id="{{PRICING_TABLE_ID}}"
publishable-key="{{PUBLISHABLE_KEY}}">
</stripe-pricing-table>
</body>
</html>
Do you guys have any solution ?
In order to test the pricing table in your local environment, you need to have have a local HTTP Server(e.g. Nginx, Apache).
The pricing table requires a website domain to render. You need to run a local HTTP server and host your website’s index.html file over the localhost domain.
More details can be found here [1].
[1] https://stripe.com/docs/payments/checkout/pricing-table#limitations:~:text=Testing%20the%20pricing,server%20npm%20module.

Twitter Card fails validation - why is this not picking up any tags

I have a bare bones html page created for testing sharing via twitter. When I test this out in twitter card validator it says:
INFO: Page fetched successfully
WARN: No metatags found
Here is the complete webpage:
<!doctype html>
<html>
<head>
<meta content="text/html; charset=UTF-8" name="Content-Type">
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="Title for this page">
<meta name="twitter:description" content="115 character description">
<meta name="twitter:image" content="https://urlToAzure/thatends/withjpgfilename.jpg">
<title>Page Title</title>
</head>
<body bgcolor="#CCCCCC">
<div id="allContentInBody">
Test page.
</div>
</body>
</html>
Here is the public link of this webpage:
https://www.privatebox.com/casa/test.html
I've updated robots.txt to allow is all.
EDIT 2: I made some progress and have additional information.
My setup is a NGINX acting as reverse proxy to node.js for all traffic, no static pages.
I setup a static page that will be served by NGINX itself. And now Twitter card validator works. I see the image and other information in the card.
So the problem is that somehow when NGINX is forwarding the request to node.js - the page served seems to be failing twitter's card validation. In that it is not able to see the metatags.
I'm certain that NGINX is not stripping the meta tags. so there is something else that twitter tries to do which my node server does not get to see and is thus failing.
Any advice on NGINX as reverse proxy with node.js and how to get twitter to work is appreciated.
I figured out the problem. It was on the node Server, I was serving the file with
res.write(<contents>)
res.end().
I changed it to
res.send(<contents>)
and that fixed the issue. The metatags are now seen by twitter card validator and the image gets picked up too.

clearing redirect cache from a different location for Chrome

How do you tell the Chrome Browser to not use the cached version of your site when it is redirected from a different location?
We have site www.example.com which has the normal cache busting techniques meta tags and adding ?a=b in your file and http calls however.
<meta http-equiv="cache-control" content="max-age=0"/>
<meta http-equiv="cache-control" content="no-cache"/>
<meta http-equiv="expires" content="0"/>
<script src="src/app.js?v=3.21.54"></script>
You update your code and all the customers get the new not the old, this works great!
Then SharePoint happened...
Your company got SharePoint which has a link to your site www.example.com but you found something odd happening Chrome uses cache when it is being redirected. Now with your bustfu failing what does one do?

File won't show in folder, but will show in root directory?

I got an empty website up and running online. Basic html5 page with a style link and a script link. It looks like this:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Taco Bell at midnight</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="css/styles.css" />
<script src="js/scripts.js" type="text/javascript"></script>
</head>
<body>
</body>
</html>
The src's are accurate, I have a folder in the same directory as the html page with the name css and js. When I try to visit them, it shows them as blank. However, when I drag the files out to the same directory as the parent, and update the href, it shows them with the content. Does anyone have an idea as to why this is happening?
It seems relevant to add I just purchased the domain today from GoDaddy, and am using x10hosting for free hosting.
UPDATE: The styles.css still appears in my home directory (in chrome, not cpanel) after being moved, and ctrl+f5'ing, and it now also appears in the folder css/styles.css as well???
UPDATE2: Now it appears as though the files are just updating really slowly? I see the changes in codeanywhere/cpanel immediately, but chrome takes like half an hour to get the changes, regardless of clearing my history/cache and ctrl+f5'ing.
x10hosting (free version, I haven't tested paid version) cache is really bad, this seems to be a server issue, sometimes it keeps showing files that you deleted hours ago, sometimes it won't show files that didn't exist beforem, you might need to wait for hours.

Application Cache manifest

<!DOCTYPE HTML>
<html manifest="example.appcache">
<link rel="stylesheet" type="text/css" href="AppCache.css">
<meta charset="utf-8">
<title>Untitled Document</title>
</head>
<body>
<p>Test to make sure css is being cached</p>
<img src="large.jpg">
<script src="AppCache.js"></script>
</body>
</html>
My example.appcache file has:
# v1 11/16/2011
AppCache.htm
AppCache.js
AppCache.css
large.jpg
The first time I navigated to the page, it asked
This website is asking to store data on your computer for offline use.
When I take Firefox offline and press refresh, the jpg disappears.
Q: What do I need to do to make sure the image is cached locally?
IIS does not serve unknown file types. You need to configure it to serve .appcache files with the MIME type text/cache-manifest, how you do this depends on which version of IIS you have:
In IIS6 use IIS manager
In IIS7 and later, you can either use IIS manager or add it in a mimeMap element in web.config
I just want to comment on the accepted answer here, as the mimetype mentioned does not work (at least in IIS7.5). The correct mimetype is:
text/cache-manifest
See:
https://developer.mozilla.org/en/Using_Application_Cache
http://www.whatwg.org/specs/web-apps/current-work/multipage/offline.html#offline
Do not forget that you need
CACHE MANIFEST
At the top of you manifest document. It is required.
CACHE MANIFEST
# v1 11/16/2011
AppCache.htm
AppCache.js
AppCache.css
large.jpg
That should do the trick