Remove trailing slash on pages with htm/html extension?

I’m just messing with netlify and I noticed an annoying issue that can break a website in certain cases. I have some websites that use “.htm” extension and would like to keep it for the sake of legacy, this issue also occurs for “.html” pages

So for example.com/somepage.htm is the original page, but someone by mistake or a wrong link visits example.com/somepage.htm/ ( Extremely common from backlinks and url sharing )

If a trailing slash is added by mistake to either htm/html extension, the site still loads fine, however if a user clicks a link on that page the new page url is now appended. So if the user now clicks anotherpage.htm, the url will go to …com/somepage.htm/anotherpage.htm, which doesn’t exist, if they hit back on their browser they go back to …com/somepage.htm/ and it’s an infinite loop of broken links. Which cannot be fixed unless the user manually knows about the trailing slash in the url and modifies it themselves.

Since _redirects doesn’t allow you to remove trailing slashes, how can one fix this issue? Now of course you can use Pretty URLs feature but that changes the url structure from /somepage.htm to /somepage, and for some use cases this is not the solution wanted

Is it anyway possible to make a html/htm page redirect to a non trailing slash version?

I noticed for Pretty URLS this is done automatically, how can it be done for htm/html extensions.

Thanks for any advice.

1 Like

Hi there, I am moving your post to a different category where it may get a bit more attention. I don’t have an answer for you just yet, but we will get back to you when we have researched this further.

Thank you.

Anyways the only solution I can think of is to use javascript to correct the url if the page is .htm/.html (but that doesn’t sound like the best idea) and to change the default back button on 404 page.

Our “Pretty URL’s” Asset Optimization feature (set on your build & deploy settings) is intended to do this automatically. Of course if you get a link to /page.html/ that is an invalid path and will produce weird results, no matter what that setting is…so for that, I’d suggest talking to whatever service is linking to you wrong about fixing those links. Or you could I suppose create a /somepage.html/index.html if you want to “handle them” in your code.

Yeah it’s just too bad you can’t fix this via _redirects, I suppose making directories is a solution, but a very painful one if you have a lot of separate pages.

Tends to happen on facebook and other link sharing social media and appears to be user error in most cases. Anyways thanks for your reply either way.

2 Likes

So i have found a way using Netlify Edge Functions

thanks for sharing this!