Slashing the Slash

Switching website to 11ty brought minimal changes when it comes to the URL setup. I actually haven’t touched URLs for years now. And there is a benefit to a stability. But then again, not all change is bad. Since 11ty did give me way more flexibility, I decided to switch things a bit.

The first change will probably not be noticed by any human. I finally removed www. prefix. And yes, both www.medo64.com and medo64.com were always supported with non-www version being redirected. However, for ages now all browsers would simply remove www prefix when displaying the address. So, one could argue that this blog’s address has been medo64.com as far as people are concerned. In .htaccess this was just a simple change to a redirect:

RewriteCond %{HTTP_HOST} ^www\.medo64\.com$ [NC]
RewriteRule ^(.*)$ https://medo64.com%{REQUEST_URI} [R=301,L]

The second change I did was getting rid of /YYYY/MM/ structure. This was actually trivial as it’s default 11ty behavior when it comes to slugs. Migrating from Wordpress, I actually had to add special slug code to retain it. Therefore, one could say I’m actually simplyhing the things now for both me and the reader.

Why did I have dates in URL in the first place? Well, I started blogging on Blogger platform that had this as default. As I moved my blog over various platforms, I just simply kept the URL format in order to make migration easier. Suffice to say, I still support old format just by a simple redirect in .htaccess:

RewriteRule ^[0-9][0-9][0-9][0-9]/[0-9][0-9]/(.*) /posts/$1 [R=301,L]

The last change is probably one I will be dealing with the longest and that will cause the most mistakes. I decided to remove the final URL slash (/). Fortunately, 11ty does support removing the slash with a simple config code:

eleventyConfig.addUrlTransform((page) => {
  if (page.url !== "/" && page.url.endsWith("/")) {
    return page.url.slice(0, -1);
  }
});

This will indeed change all 11ty generated URLs but mission is not accomplished yet. In my case, this broke page retrieval (e.g. used for literal pages). For example, in order to match both slash-anding and non-slash-ending pages, I now use:

return arr.filter(item => urls.includes(item.url) || urls.includes(item.url + '/'));

But that alone is not sufficient on Apache (and I suspect many different web servers). You also need to tell it to read index.html when user asks for a directory. I personally solve this in .htaccess:

RewriteCond %{REQUEST_URI} !/$
RewriteCond %{REQUEST_URI} !\.html$
RewriteCond %{REQUEST_FILENAME} -d
RewriteCond %{REQUEST_FILENAME}/index.html -f
RewriteRule ^(.*)$ $1/index.html

And yes, we’re still not done as there is yet another change to make. What you need it also a Directory directive in your apache configuration file:

<Directory "/srv/apache/">
  AllowOverride FileInfo
  DirectorySlash Off
</Directory>

And with all this in place I finally got rid of the pesky slash. So much work for a single character.

And there is also some minor work intentionally remaining. For example, I don’t redirect slash-URL to its non-slashed version. Not because it’s hard but because browser might have cached the old redirect thus making it a potential loop. I will probably come back and clean that up only after a month or two.

Moreover, as with all changes, I am sure I missed something. But, with 11ty in the backend, I am sure fixing stuff won’t be too difficult, once issue is discovered.