Absolute (full) URLs without "http:" in HTML href - http

I have been seeing this a lot lately and I am unable to find any information on it.
Is there a name for it?
Which browsers support this?

It's the same as an absolute URL except that the schema will be the one used for the base URL. Thus, if you say //mysite.com/images/img.png on an https page, the image will be loaded with https and on an "ordinary" http page it will be loaded using the http schema (and, respectively, different default ports.)
This approach lets avoid the security warnings from browsers in the case when you have insecure content loaded by secure pages (and the pages can be loaded using both http and https protocols).

Related

HTTPS iframe inside a HTTPS page not working

How can we use github pages embedded in an iframe correctly?
I've hosted a website in firebase and it is using a custom domain over https, for example, https://www.example.com.
This website uses react and other things, but for one route (the landing page one) I would like to use a static page hosted on github, for example https://example.github.io/page. So, to achieve this I've created an iframe inside the route https://www.example.com/page.
The problem is I've been receiving the following error:
Mixed Content: The page at 'https://www.example.com/page' was loaded
over HTTPS, but requested an insecure resource
'http://example.github.io/page/'. This request has been blocked; the
content must be served over HTTPS.
The strange thing is the iframe looks correctly:
<iframe title="Page" src="https://example.github.io/page">unwanted text</iframe>
It is already using https, but looks like this is being ignored.
I already tried to use this meta <meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">, close the iframe with </iframe> and add an unwanted text inside the iframe.
Can we solve this?
If you carefully examine your HTML code and the error message, you'll notice a slight difference in URLs besides the protocol part:
https://example.github.io/page - in the iframe src tag
http://example.github.io/page/ - in the error message
The reason could be that the URL https://example.github.io/page returns a redirect to the "canonical" version with the trailing slash (/page/), but a redirect URL must be a full URL, and the server for some reason isn't including the actual protocol in the redirect URL, always using http:// instead. That could be due to configuration or coding at the server side (see also github issue #289).
As a workaround, use a URL that doesn't trigger the canonicalization redirect, i.e. https://example.github.io/page/.

some CSS can not show when swith the website from http to https

I have a website written in Ruby using Ruby on Rail framwork, everything was fine when using HTTP protocol, but when switching to HTTPS protocol.
Some CSS material can not shown, but some of it can.
The font can not be shown, originally the font was designed, but now it is not.
Anyone know what happen?
Without any specific error I assume browser is probably blocking files loading from mixed content, i.e. using both HTTP and HTTPS. Use your browser developer tools network tab to confirm this.
You can use // instead of http:// so that resources load from the relative protocol that the page content is loading from; Can I change all my http:// links to just //?
Also read; How to fix a website with blocked mixed content

Plone, behaviour of URLs

The situation is the following: I created a site with Plone, developed, used, but behind a test URL. Now it has to be published, but the test URL is not appropriate and I don't want to move the site. I think, if I use a redirect, it won't be appear in the URL-bar, only in the case of site start page. Am I wrong? (The test URL should not be used, because it will be a "semi-official" site.) What do you suggest to do?
As far as I can see Plone uses absolute URLs everywhere. I can add relative URLs, but if I create a new page, a new event, etc., then they have absolute URLs on other automatically generated inner pages. Is there any way to convert these URLs to relative paths? Is there any setting possibilty where only a checkbox changes this default setting?
Plone does not store your URLs in the database. It uses the inbound host header (and any virtual hosting configuration set up with rewrite rules in Apache or Nginx) to calculate the correct absolute URL when rendering the page.
In other words - as soon as you actually point the relevant domain name to the server with your Plone instance, it'll just work.
P.S.
You should put a bit more effort into asking your question. This is just a copy and paste of a half-finished email chain where you tried to get the answer from me in private. It's not very easy to understand what you're asking.
I think what you are looking for is url rewriting to handle virtual hosting. ie to get your site to appear as if it's the root url of a domain.
This is normally done via the webserver that normally sits in front of plone. For apache, here is a howto
http://plone.org/documentation/kb/plone-apache/virtualhost
for other servers
http://plone.org/documentation/manual/plone-community-developer-documentation/hosting
You can also achieve this directly in zope (via ZMI) using something called the Virtual Host
Monster. see http://docs.zope.org/zope2/zope2book/VirtualHosting.html
PS. I don't think your question is badly worded. Plone does serve pages with a "base" tag and what appears to be absolute urls. They aren't baked into the database but it's also not obvious that the solution to getting the url you want is the VHM url syntax and a proxying frontend webserver. There is a reason why it doesn't use relative urls... which I can't remember it was so long ago.

Link to CSS files across domains without mixed content warning in IE?

My sites run off a subdomain (yyy.example.com), but I'm required to include CSS files from the main domain (example.com). We run a CMS that doesn't let me do any server-side stuff during the preview stage, so I'm stuck sending a page over https that includes a CSS import to http. All my IE users get a mixed content warning because of this.
Is there any client side way for me to prevent this, other than maintaining separate security settings for the domain on every client machine?
Make use of protocol-relative URL's in the CSS links.
Thus so
<link rel="stylesheet" type="text/css" href="//example.com/style.css">
instead of
<link rel="stylesheet" type="text/css" href="http://example.com/style.css">
It will automatically pick the protocol of the parent request, which should work fine for HTTPS as well.
As far as I know, there's no way to avoid that warning. It's there particularly for this purpose: alert you to the fact that even though you believe your page is SSL-encrypted, some of its content isn't. You'll either need to serve the original page over HTTP (not recommended), or serve the CSS file over HTTPS.
There is one proviso .. IE downloads the resources twice it seems.
http://www.stevesouders.com/blog/2010/02/10/5a-missing-schema-double-download/
When you say that you cannot do "server-side" stuff, do you mean that you cannot touch your CMS, or that you do not have root access to your HTTP server?
Because if you do have access to your HTTP server, you could set up a very simple reverse proxy (with mod_proxy if you are using Apache). This would allow you to use relative paths in your HTML, while the HTTP server would be acting as a proxy to any "remote" location. In fact this technique can also be used to mitigate some cross-site scripting issues.
The fundamental configuration directive to set up a reverse proxy in mod_proxy is the ProxyPass. You would typically use it as follows:
ProxyPass /css/ http://example.com/css_dir/
In this case, the browser would be requesting https://yyy.example.com/css/main.css but the server would serve this by acting as a proxy to http://example.com/css_dir/main.css. It will not raise the browser warning, and works fine with SSL.

SSL and mixed content due to CSS background images

I have a web page containing am entry form. HTTPS is enabled via an Apache redirect for all requests matching that page. Unfortunately, because the CSS pulls in external images using 'background-image: url(/images/...)', the browser will generate a warning message that the page contains mixed content.
What's the best way to resolve this issue?
Update 2014.12.17:
Now that SSL is encouraged for everyone and doesn’t have performance
concerns, this technique is now an anti-pattern. If the asset you > need is available on SSL, then always use the https:// asset.
Allowing the snippet to request over HTTP opens the door for attacks
like the recent Github Man-on-the-side attack. It’s always safe to
request HTTPS assets even if your site is on HTTP, however the reverse
is not true.
More guidance and details in Eric Mills’ guide to CDNs & HTTPS.
Source: Paul Irish – The Protocol-relative URL
Here is a very popular solution:
There's this little trick you can get away with that'll save you some headaches:
In HTML
<img src="//domain.com/img/logo.png">
In CSS
div{background: url(//path/to/image.png);}
You should also enable HTTPS for your static resources, and then make sure that the <link> refers explicitly to the HTTPS url for the CSS resource (whose relative urls will then be interpreted relative to the HTTPS base of the CSS file).
You should use full URL for your image:
https://your.domain.com/img/image.png`
or
https://your.domain.com/route/to/img/image.png
This solved my problem some time ago.

Resources