Imagine that you have two or more subdomains, and you want to serve two different web applications. However, you do not want to create a different web server application for each subdomain.
In this kind of situation, Node.js allows developers to manage virtual domains within a single web server application using vhost library.
In this post, we will learn how to create and manage virtual domains using Vhost.
What is Vhost ?
As already said, Vhost is a Node.js library that allows developers to manage virtual domains within a single web server application. It provides a configurable middleware function that accepts two arguments. The first one is the hostname. The second argument is the request handler which will be called when the hostname matches. The hostname follows the same rules as route paths do. They can be either a string or a regular expression.
Getting ready with Vhost
First, initialize the project by opening a terminal and running :
npm init
Then, install the necessary dependencies by running:
npm install vhost express
How to do it…
build two mini-applications using Router that will be served in two different sub-domains:
Create a new file named virtual-domains.js Include vhost NPM module. Then, initialize a new ExpressJS application:
import express from ‘express’
import vhost from ‘vhost’
const app = express()
Define two routers that we will use to build two mini-applications:
const app1 = express.Router()
const app2 = express.Router()
Add a route method to handle GET requests for path “/” in the first router:
app1.get('/', (req, res, next) => {
res.send('This is the main application.')
})
Add a route method to handle GET requests for path “/” in the second router:
app2.get('/', (req, res, next) => {
res.send('This is a second application.')
})
Mount our routers to our ExpressJS application. Serve the first application under localhost and the second under second.localhost:
app.use(vhost('localhost', app1))
app.use(vhost('second.localhost', app2))
Listen on port 1337 for new connections:
app.listen(
1337,
() => console.log('Web Server running on port 1337'),
)
Save the file
Open a terminal and run:
node virtual-domains.js
To see the result, in your web browser navigate to:
http://localhost:1337/
http://second.localhost:1337/
That is it! We have created two domains name related to the same server.
There’s more…
Vhost adds a Vhost object to the request object, which contains the complete hostname (displaying the hostname and port), hostname (without the port), and matching strings. These give you more control over how to handle virtual domains. For example, we could write an application that allows users to have their own sub-domain with their name:
Create a new file named user-subdomains.js
Include the vhost NPM module. Then, initialize a new ExpressJS application:
Import express from ‘express’
Import vhost from ‘vhost’
const app = express()
Define a new router. Then, add a route method to handle GET requests on the path “/”. Use the vhost object to access the array of subdomains:
const users = express.Router()
users.get('/', (req, res, next) =
> {
const username = req
.vhost[0]
.split('-')
.map(name => (
name[0].toUpperCase() +
name.slice(1)
))
.join(' ')
res.send(`Hello, ${username}`)
})
Mount the router:
app.use(vhost('*.localhost', users))
Listen on port 1337 for new connections:
app.listen(
1337,
() => console.log('Web Server running
on port 1337'),
)
Save the file
Open a terminal and run:
node user-subdomains.js
To see the result, in your web browser, navigate to:
http://john-thomas.localhost:1337/
http://jx-huang.localhost:1337/
http://superman.localhost:1337/
Conclusion
We did it! Now that you have known how to create and manage virtual domains, it’s your chance to create something amazing with it. Maybe a video conference application that allows users to have their own sub-domain with their room name.
You can find the complete source code for this small application in this repository.
THANK YOU FOR READING
I hope you found this little article helpful. Please share it with your friends and colleagues. Sharing is caring.
Connect with me on various platforms
Top comments (3)
WHat about with typescript
Repository is not accessible.
Been looking for this simple tutorial like this since a few days
Thanks for completing my goals for January
I assume it’s don’t mess with my dns config or name records on my hosting provider