Skip to content

Instantly share code, notes, and snippets.

@konklone
Last active January 2, 2024 15:09
Show Gist options
  • Save konklone/9968713 to your computer and use it in GitHub Desktop.
Save konklone/9968713 to your computer and use it in GitHub Desktop.
Force a quick redirect to HTTPS on Github Pages for your domain (and only your domain)
<script>
var host = "YOURDOMAIN.github.io";
if ((host == window.location.host) && (window.location.protocol != "https:"))
window.location.protocol = "https";
</script>
@bloodyowl
Copy link

var host = "YOURDOMAIN.github.io"
if (window.location.host == host && window.location.protocol != "https:") {
  window.location.protocol = "https:"
}

might be simpler

@konklone
Copy link
Author

didn't know you could do that! I'll change it, thanks.

@Cnly
Copy link

Cnly commented Oct 4, 2015

Would this be simpler?

<script>
if (window.location.host.indexOf('github.io') > -1 && window.location.protocol != "https:"){
    window.location.protocol = "https";
}
</script>

@konklone
Copy link
Author

konklone commented Oct 4, 2015

@Cnly Nice, that does seem simpler. I'd want it to be locked to hosts ending with github.io though, not just where it appears in the host name (e.g. http://github.iomega.com to make up an example).

@FirePanther
Copy link

<script>
if (window.location.host.substr(-10) == '.github.io' && window.location.protocol != 'https:') {
    window.location.protocol = 'https:';
}
</script>

@le4ker
Copy link

le4ker commented Oct 20, 2015

I added a check for localhost, given that the common case is that when you hack your Jekyll site locally you don't have https setup.

  {% if site.force-https %}
    <script>
    // Don't force http when serving the website locally
    if (!(window.location.host.startsWith("127.0.0.1")) && (window.location.protocol != "https:"))
        window.location.protocol = "https";
    </script>
  {% endif %}

@brbsix
Copy link

brbsix commented Nov 28, 2015

Just out of curiosity, but why are you checking that host == window.location.host? Is this because you don't want to force redirect to HTTPS if the visitor is at a custom domain that does not support HTTPS?

@PanosSakkos don't forget to include localhost:

<script>
if (!(window.location.host.startsWith("127.0.0.1") || window.location.host.startsWith("localhost")) && (window.location.protocol != "https:"))
    window.location.protocol = "https";
</script>

@prahladyeri
Copy link

Since I do a lot of local testing before pushing commits to my site, I need to check that in the script:

<script>
// Don't force https when serving the website locally
if (!(window.location.host.startsWith("127.0.0.1")) && (window.location.protocol != "https:"))
    window.location.protocol = "https";
</script>

However, I still think what we all are doing is just another ugly hack. This feature needs to be built-into github pages.

@prahladyeri
Copy link

Since I do a lot of local testing before pushing commits to my site, I need to check that in the script:

<script>
// Don't force https when serving the website locally
if (!(window.location.host.startsWith("127.0.0.1")) && (window.location.protocol != "https:"))
    window.location.protocol = "https";
</script>

However, I still think what we all are doing is just another ugly hack. This feature needs to be built-into github pages.

@mikeumus
Copy link

mikeumus commented Jan 2, 2016

The most efficient way I've found to do this in the present is with CloudFlare's Page Rules:

CloudFlare always HTTPS page rules

See this tutorial on how to set this up on GitHub Pages:

but also agreeing with @prahladyeri and others that this should be configurable in GitHub Pages itself 👍.

@hakatashi
Copy link

GitHub Pages now supports enforcement of HTTPS via config.

@erm3nda
Copy link

erm3nda commented Jun 13, 2016

Because my Github page shows ssl warnings, i've reverse the example and added this piece of code to every .html and .md file to show it with http:

<script>
    if (window.location.host.indexOf('github.io') > -1 && window.location.protocol == "https:"){
        window.location.protocol = "http";
    }
</script>

Those files are fully public, there's no real reason to pass them with ssl to the user.
Maybe i add Ajax on the future, but it's good enough for now. Still don't know if there's something to try with yaml config for this.

@sanikkenway
Copy link

@hakatashi thanks, saves me the hassle

@JCarlosR
Copy link

JCarlosR commented Dec 7, 2016

@mikeumus "Always uses https" is equivalente to the 301 redirects?
Here is a tutorial about that: https://rck.ms/jekyll-github-pages-custom-domain-gandi-https-ssl-cloudflare/

@yowainwright
Copy link

@mikeumus worked AWESOMELY!!! ~THANK YOU!!!

@englishextra
Copy link

englishextra commented Jun 18, 2017

You must check for http and NOT for https

bad:

window.location.protocol != "https:"

safe:

window.location.protocol === "http:"

Why? Because in webapps wrapped in Electron and NWjs there's no http - it's file: and chrome-extension:

So:

/*global window */
/*jslint browser: true */
(function (root) {
	"use strict";
	var h = root ? root.location.hostname : "",
	p = root ? root.location.protocol : "";
	if ("http:" === p && !(/^(localhost|127.0.0.1)/).test(h)) {
		root.location.protocol = "https:";
	}
}
	("undefined" !== typeof window ? window : this));

@infinitbility
Copy link

In this article, explain how to work HTTPS URL for your custom domain if you are using cloudflare.

https://infinitbility.com/always-use-https-url-using-cloudflare

@drortirosh
Copy link

shorter condition:

 if (window.location.href.match("http://MYDOMAIN")) window.location.protocol='https:'

Note that the MYDOMAIN can even be partial (e.g. to support both domain.github.io, domain.com, whatever) or use more complex regex matching. The important thing is to avoid the test domains (http://localhost, http://127.0.0.1, etc)

@Pravardhitha
Copy link

but where should i add the code. into my index.html?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment