Overview
When a user visits a URL that needs to be redirected, such as blokhost.com/features/forms to blokhost.com/docs/forms, the server sends an explicit instruction to the browser to find the requested resource elsewhere.
HTTP/HTTPS is the web protocol that enables the communication between the client and server. The server uses HTTP status codes to communicate the status of a request to the browser. Commonly known status codes include 200 OK for successful requests and 404 Not Found for failed requests. HTTP status codes are categorized by response type, with redirect responses under 3XX.
Handling Redirects
Developers can easily configure redirects in BlokHost without complex server configurations or response header modifications. Instead, you can create redirects directly from the BlokHost dashboard, allowing you to quickly manage and update them as needed.
With BlokHost, you don't need to worry about the technical details of creating redirects, such as configuring .htaccess for Apache or nginx.conf for Nginx. Instead, you can focus on your website content and let BlokHost redirect content for you, making it easier to manage your website and ensuring visitors are directed to the correct page.
The _redirects File
The _redirects file is a configuration file that allows you to specify how incoming requests to your website should be redirected. This file should be placed in the root of your published site and contains a list of redirect rules in the format of source destination [status]. The source is the URL being redirected, the destination is the new URL, and the status is the HTTP status code for the response. This file should generally be in your build output file, a folder called build/ or public/, depending on your project's configuration.
A basic redirect in BlokHost looks like this:
/login /web3/login
By default, redirect rules are given a status code of 301, a permanent redirect. You can easily make the redirect temporary by specifying a status code like this:
/posts /blog 302
You can also specify the HTTP status code for the response. Setting status codes in the redirect rules can be helpful when you want to handle no longer used routes and permanently deleted resources gracefully.
/store /not_found 404
Basic Redirect
A basic redirect in BlokHost looks like this:
/login /web3/login
Status Code Redirect
By default, redirect rules are given a status code of 301, a permanent redirect. You can easily make the redirect temporary by specifying a status code like this:
/posts /blog 302
You can also specify the HTTP status code for the response. Setting status codes in the redirect rules can be helpful when you want to handle no longer used routes and permanently deleted resources gracefully.
/store /not_found 404
Wildcards
Wildcards can also be used to match patterns in the URLs being redirected. For example, you can use a wildcard to match all blog posts and redirect them to a new blog:
/blog/* /new-blog 301
Using wildcard routes can be very useful when you want to redirect many URLs with a common pattern. However, it's essential to use them carefully and test thoroughly to ensure you're not accidentally redirecting URLs that should not be redirected.
Clean URLs in SPAs
Another everyday use case for redirects in BlokHost is to enable clean URLs in single-page applications (SPAs) with a history push state. Without redirects, refreshing a page in a SPA with a URL like 1a9b600b66096b386057c6b85033e32d.blok.host/about results in a 404: Not Found error page.
Routes in SPAs are client-side rendered, meaning that route changes only correspond to changes in the page content. Without an explicit redirect, BlokHost bots assume that you are requesting a page separate from /index.html; since that page doesn't exist, it returns an error. To enable clean URLs in your BlokHost deployed SPAs, add the following rule to your redirects file:
/* /index.html 200
Redirecting all pages to a maintenance page
There may be times when you need to take your website down for maintenance or updates. Rather than showing a 404 error or letting users see a broken website, you can redirect all pages to a maintenance page using the _redirects file.
To do this, you can use a wildcard route to match all incoming requests and redirect them to your maintenance page. In addition, you can use a status code of 503, which indicates that the server is temporarily unavailable due to maintenance or overload.
Here's an example of how you can redirect all pages to a maintenance page:
/* /maintenance.html 503
In this example, the * wildcard matches any incoming request, and all requests are redirected to the maintenance.html page with a status code of 503.
Redirecting to an external website
Sometimes, redirect users to an external website rather than a page on your site. For example, if you're running a promotion with a partner company, redirect users to their website to complete the transaction.
To redirect to an external website, you can specify the full URL in the destination field of your redirect rule. You can also use a status code of 301 or 302 to indicate whether the redirect is permanent or temporary.
Here's an example of how you can redirect to an external website:
/jobs https://careers.example.com 301
In this example, any requests to /jobs on your website are redirected to https://careers.example.com with a status code of 301. This code will tell search engines that the redirect is permanent and update their index accordingly.
The BlokHost Solution
BlokHost makes achieving a redirect a total breeze. The most common strategy to enable redirects in BlokHost is via the _redirects file. Place the file in the root of your published site, and it just works. Blokhost _redirects are compatible with many other SPA hosting providers such as Netlify & Vercel to ensure the smoothest migration possible, _redirects can also be updated directly from the BlokHost Admin panel
In conclusion, redirect rules are valuable mechanisms for managing traffic flow to your websites, and BlokHost provides an easy solution to handle redirects without having to fuss with unwieldy server configurations. To learn more about redirects and start building your own, check out the BlokHost Redirects documentation.
Top comments (0)