Оффлайн
- Регистрация
- 1 Мар 2015
- Сообщения
- 1,481
- Баллы
- 155
Any good product these days must have some way to send notifications to users across different channels. As an engineer, building and managing the infrastructure required can be a time-consuming endeavour, especially if we have complex scenarios and multiple notification channels. In this article, we will be looking at how to deploy Novu, an open-source notification system, on a virtual machine.
Let's get started!
Getting Started
This article is the second part of a short series on deploying Novu, an open-source notification system. The first part of the article can be read .
This article builds on the first one, so it is necessary to read that first.
When deploying to a VM using just the VM's IP address, the is sufficient.
However, if we need our setup to use domain names or subdomains, we need to make some changes to our .env files in our Docker folder.
This article focuses on using Nginx as a proxy server on a Linux virtual machine. To properly set up our Novu application, we must also make some changes to our Nginx configuration.
Let's assume that we want to deploy our Novu applications to the following URLs:
We use a different URL for the WebSocket service because the WebSocket URL has to be configured to a root path.
Configuring Nginx to Serve Our Applications
We need different Nginx configurations for the various parts of the app.
One thing to note is to make sure that the root path points to the web app.
Since we can only have one root path per configuration, we need a different configuration that will have a root path that points to the WebSocket service.
Let's create a configuration for our Nginx server in the /etc/nginx/sites-enabled folder:
> cd /etc/nginx/sites-enabled
# create a new file
> sudo touch novu
# open the file for editing
> sudo vim novu
Next, we edit the content of the config file to proxy for both the Novu app and the API:
server {
server_name notifications.example.com;
access_log /var/log/nginx/access.log;
client_max_body_size 40M;
location / {
proxy_pass http://localhost:4200;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
}
location /api {
proxy_pass http://localhost:3000;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
rewrite ^/api/(.*) /$1 break;
}
}
Here we configure our Nginx to proxy all requests to to the container running on , which is the Novu application dashboard.
We also configure to proxy to , which is the Novu API server. The last line rewrite ^/api/(.*) /$1 break; ensures we strip away the /api/ before forwarding it to localhost:3000.
Since our WebSocket service will be on a different path, let's create a new Nginx config for the WebSocket service:
# create a new file
> sudo touch novu-ws
# open the file for editing
> sudo vim novu-ws
We then add the Nginx config for WebSocket to novu-ws:
server {
server_name notifications-ws.example.com;
access_log /var/log/nginx/access.log;
client_max_body_size 40M;
location / {
proxy_pass http://localhost:3002;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection 'upgrade';
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_read_timeout 3600s;
proxy_send_timeout 3600s;
}
}
Here, we proxy all traffic to to the WebSocket service running on . The request is upgraded to a WebSocket request, and a timeout is also set.
Configuring the Novu Application
Once we have Nginx configured, we must configure our Novu application to reference the new URLs.
Let's edit the content of our .env file in the folder containing our Novu Docker compose file:
> cd novu/docker/community
# open the file for editing
> sudo vim .env
Since we have absolute paths for the Novu Dashboard, API, and WebSocket, we need to update our .env file to reference these new locations.
First, let's add the absolute URLs as variables:
## code committed for brevity
# Host
HOST_NAME=
API_HOST_NAME=
WS_HOST_NAME=
Next, we change the values for API_ROOT_URL and REACT_APP_WS_URL:
# Root URL
REACT_APP_WS_URL=$WS_HOST_NAME
# code committed for brevity
API_ROOT_URL=$API_HOST_NAME
We then rebuild our Docker containers and restart nginx:
> sudo docker compose down
# start container
> sudo docker compose up -d
# restart Nginx
> sudo systemctl restart nginx
The Novu dashboard should be available on .
The API URL and Websocket should be available on and , respectively.
We can secure our application by configuring SSL for our application using this .
Conclusion
In the second part of our series, we focus on configuring our Novu application when hosting it on a virtual machine.
Let's get started!
Getting Started
This article is the second part of a short series on deploying Novu, an open-source notification system. The first part of the article can be read .
This article builds on the first one, so it is necessary to read that first.
When deploying to a VM using just the VM's IP address, the is sufficient.
However, if we need our setup to use domain names or subdomains, we need to make some changes to our .env files in our Docker folder.
This article focuses on using Nginx as a proxy server on a Linux virtual machine. To properly set up our Novu application, we must also make some changes to our Nginx configuration.
Let's assume that we want to deploy our Novu applications to the following URLs:
- Novu Application:
- Novu Websocket URL:
We use a different URL for the WebSocket service because the WebSocket URL has to be configured to a root path.
Configuring Nginx to Serve Our Applications
We need different Nginx configurations for the various parts of the app.
One thing to note is to make sure that the root path points to the web app.
Since we can only have one root path per configuration, we need a different configuration that will have a root path that points to the WebSocket service.
Let's create a configuration for our Nginx server in the /etc/nginx/sites-enabled folder:
> cd /etc/nginx/sites-enabled
# create a new file
> sudo touch novu
# open the file for editing
> sudo vim novu
Next, we edit the content of the config file to proxy for both the Novu app and the API:
server {
server_name notifications.example.com;
access_log /var/log/nginx/access.log;
client_max_body_size 40M;
location / {
proxy_pass http://localhost:4200;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
}
location /api {
proxy_pass http://localhost:3000;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
rewrite ^/api/(.*) /$1 break;
}
}
Here we configure our Nginx to proxy all requests to to the container running on , which is the Novu application dashboard.
We also configure to proxy to , which is the Novu API server. The last line rewrite ^/api/(.*) /$1 break; ensures we strip away the /api/ before forwarding it to localhost:3000.
Since our WebSocket service will be on a different path, let's create a new Nginx config for the WebSocket service:
# create a new file
> sudo touch novu-ws
# open the file for editing
> sudo vim novu-ws
We then add the Nginx config for WebSocket to novu-ws:
server {
server_name notifications-ws.example.com;
access_log /var/log/nginx/access.log;
client_max_body_size 40M;
location / {
proxy_pass http://localhost:3002;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection 'upgrade';
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_read_timeout 3600s;
proxy_send_timeout 3600s;
}
}
Here, we proxy all traffic to to the WebSocket service running on . The request is upgraded to a WebSocket request, and a timeout is also set.
Configuring the Novu Application
Once we have Nginx configured, we must configure our Novu application to reference the new URLs.
Let's edit the content of our .env file in the folder containing our Novu Docker compose file:
> cd novu/docker/community
# open the file for editing
> sudo vim .env
Since we have absolute paths for the Novu Dashboard, API, and WebSocket, we need to update our .env file to reference these new locations.
First, let's add the absolute URLs as variables:
## code committed for brevity
# Host
HOST_NAME=
API_HOST_NAME=
WS_HOST_NAME=
Next, we change the values for API_ROOT_URL and REACT_APP_WS_URL:
# Root URL
REACT_APP_WS_URL=$WS_HOST_NAME
# code committed for brevity
API_ROOT_URL=$API_HOST_NAME
We then rebuild our Docker containers and restart nginx:
> sudo docker compose down
# start container
> sudo docker compose up -d
# restart Nginx
> sudo systemctl restart nginx
The Novu dashboard should be available on .
The API URL and Websocket should be available on and , respectively.
We can secure our application by configuring SSL for our application using this .
Conclusion
In the second part of our series, we focus on configuring our Novu application when hosting it on a virtual machine.