How to setup separate frontend and backend¶
If you want to have a setup with separate frontend from backend we recommend to use a domain configuration like the following:
frontend: domain.tld
backend: backend.domain.tld
How to install backend depending on OS¶
In order to setup the backend, please follow the steps for the operating system of your choice.
Ubuntu 16.04¶
You need to follow the Ubuntu16.04 guide, but skip the fleio-frontend package installation.
Ubuntu 18.04¶
You need to follow the Ubuntu18.04 guide, but skip the fleio-frontend package installation.
Backend setup¶
After you finish the bootstrap you need to create a CSRF middleware with the following content (no mater what OS you are using (take care at the indentation):
vi /var/webapps/fleio/project/fleio/csrf_pass.py
from django.conf import settings
from django.http.request import split_domain_port
from django.utils.deprecation import MiddlewareMixin
class CsrfMid(MiddlewareMixin):
def process_request(self, request):
dom, port = split_domain_port(request.get_host())
if dom.endswith('domain.tld'):
settings.CSRF_COOKIE_DOMAIN = 'domain.tld'
settings.CSRF_COOKIE_NAME = 'csrfback'
else:
settings.CSRF_COOKIE_DOMAIN = None
settings.CSRF_COOKIE_NAME = 'csrftoken'
def process_response(self, request, response):
dom, port = split_domain_port(request.get_host())
if dom.endswith('domain.tld'):
settings.CSRF_COOKIE_DOMAIN = 'domain.tld'
settings.CSRF_COOKIE_NAME = 'csrfback'
else:
settings.CSRF_COOKIE_DOMAIN = None
settings.CSRF_COOKIE_NAME = 'csrftoken'
return response
Using this configuration, you need to also add the following lines in
/var/webapps/fleio/project/fleio/fleiosettings/settings.py
:
INSTALLED_APPS += (
'corsheaders', # you need this only if backend and frontend hosts are different
)
NEW_MIDDLEWARE_CLASSES = list(MIDDLEWARE)
NEW_MIDDLEWARE_CLASSES.insert(1, 'corsheaders.middleware.CorsMiddleware')
NEW_MIDDLEWARE_CLASSES.insert(1, 'fleio.csrf_pass.CsrfMid')
MIDDLEWARE = tuple(NEW_MIDDLEWARE_CLASSES)
CORS_ORIGIN_WHITELIST = (
'http://domain.tld',
'http://backend.domain.tld',
)
CORS_ALLOW_CREDENTIALS = True
CSRF_TRUSTED_ORIGINS = ['domain.tld', 'backend.domain.tld']
After editing the settings.py
file, you must restart all the fleio
services (see Restarting Fleio).
How to install and configure frontend depending on OS¶
In order to setup additional a separate frontend, please follow the steps for the operating system of your choice:
Ubuntu 16.04¶
First we will need to install the prerequisites:
apt-get update
apt-get install curl software-properties-common apt-transport-https
curl https://repos.fleio.com/public.key | apt-key add -
add-apt-repository "deb [arch=amd64] https://repos.fleio.com/ubuntu xenial main"
apt-get update
apt-get install fleio-frontend nginx
The next step will be to configure Fleio:
cp /var/webapps/fleio/frontend/site/template_constants.js /var/webapps/fleio/frontend/site/constants/constants.js
cp /var/webapps/fleio/frontend/site/staff/template_constants.js /var/webapps/fleio/frontend/site/staff/constants/constants.js
sed -i 's|http://localhost:8000/api|http://backend.domain.tld/backend/api|g' /var/webapps/fleio/frontend/site/constants/constants.js
sed -i 's|http://localhost:8000/staffapi|http://backend.domain.tld/backend/staffapi|g' /var/webapps/fleio/frontend/site/staff/constants/constants.js
You will need to add the django CSRF cookie name in `/var/webapps/fleio/frontend/site/constants/constants.js`
and
`/var/webapps/fleio/frontend/site/staff/constants/constants.js`
...
djangoCsrf: {
'cookieName': 'csrfback',
'headerName': 'X-CSRFToken'
},
...
After that you need to create the frontend Nginx configuration file:
vi /etc/nginx/sites-enabled/domain.tld.conf
server {
listen 80;
client_max_body_size 5000m;
server_name domain.tld;
location /images {
alias /var/webapps/fleio/frontend/site/images/;
break;
}
location /js {
alias /var/webapps/fleio/frontend/site/js/;
expires max;
break;
}
location /vendor {
alias /var/webapps/fleio/frontend/site/vendor/;
expires max;
break;
}
location /styles {
alias /var/webapps/fleio/frontend/site/styles/;
expires max;
break;
}
location /reseller {
alias /var/webapps/fleio/frontend/reseller/;
expires -1;
try_files $uri $uri/ /../reseller/index.html;
}
location /staff {
alias /var/webapps/fleio/frontend/site/staff/;
expires -1;
try_files $uri $uri/ /staff/index.html;
}
location /newstaff {
alias /var/webapps/fleio/frontend/staff/;
expires -1;
try_files $uri $uri/ /../staff/index.html;
}
location / {
alias /var/webapps/fleio/frontend/site/;
expires -1;
try_files $uri $uri/ /index.html;
}
}
Lastly you need to check the Nginx configuration using nginx -t
command. If everything is ok you can restart it using
the following command:
systemctl restart nginx
Ubuntu 18.04¶
First we will need to install the prerequisites:
apt-get update
apt-get install curl software-properties-common apt-transport-https
curl https://repos.fleio.com/public.key | apt-key add -
add-apt-repository "deb [arch=amd64] https://repos.fleio.com/ubuntu bionic main"
apt-get update
apt-get install fleio-frontend nginx
The next step will be to configure Fleio:
cp /var/webapps/fleio/frontend/site/template_constants.js /var/webapps/fleio/frontend/site/constants/constants.js
cp /var/webapps/fleio/frontend/site/staff/template_constants.js /var/webapps/fleio/frontend/site/staff/constants/constants.js
sed -i 's|http://localhost:8000/api|http://backend.domain.tld/backend/api|g' /var/webapps/fleio/frontend/site/constants/constants.js
sed -i 's|http://localhost:8000/staffapi|http://backend.domain.tld/backend/staffapi|g' /var/webapps/fleio/frontend/site/staff/constants/constants.js
You will need to add the django CSRF cookie name in `/var/webapps/fleio/frontend/site/constants/constants.js`
and
`/var/webapps/fleio/frontend/site/staff/constants/constants.js`
...
djangoCsrf: {
'cookieName': 'csrfback',
'headerName': 'X-CSRFToken'
},
...
After that you need to create the frontend nginx configuration file:
vi /etc/nginx/sites-enabled/domain.tld.conf
server {
listen 80;
client_max_body_size 5000m;
server_name domain.tld;
location /images {
alias /var/webapps/fleio/frontend/site/images/;
break;
}
location /js {
alias /var/webapps/fleio/frontend/site/js/;
expires max;
break;
}
location /vendor {
alias /var/webapps/fleio/frontend/site/vendor/;
expires max;
break;
}
location /styles {
alias /var/webapps/fleio/frontend/site/styles/;
expires max;
break;
}
location /reseller {
alias /var/webapps/fleio/frontend/reseller/;
expires -1;
try_files $uri $uri/ /../reseller/index.html;
}
location /staff {
alias /var/webapps/fleio/frontend/site/staff/;
expires -1;
try_files $uri $uri/ /staff/index.html;
}
location /newstaff {
alias /var/webapps/fleio/frontend/staff/;
expires -1;
try_files $uri $uri/ /../staff/index.html;
}
location / {
alias /var/webapps/fleio/frontend/site/;
expires -1;
try_files $uri $uri/ /index.html;
}
}
Lastly you need to check the Nginx configuration using nginx -t
command. If everything is ok you can restart it using
the following command:
systemctl restart nginx
Centos 7¶
Fleio is using dependencies that are available in epel. This package ensures that this extra repository is enabled along with Fleio repository.
First we will need to install the prerequisites, and to disable Selinux:
setenforce 0
yum install https://repos.fleio.com/rhel/7/fleio-release-1-2.el7.noarch.rpm
yum install fleio-frontend nginx
The next step will be to configure Fleio:
cp /var/webapps/fleio/frontend/site/template_constants.js /var/webapps/fleio/frontend/site/constants/constants.js
cp /var/webapps/fleio/frontend/site/staff/template_constants.js /var/webapps/fleio/frontend/site/staff/constants/constants.js
sed -i 's|http://localhost:8000/api|http://backend.domain.tld/backend/api|g' /var/webapps/fleio/frontend/site/constants/constants.js
sed -i 's|http://localhost:8000/staffapi|http://backend.domain.tld/backend/staffapi|g' /var/webapps/fleio/frontend/site/staff/constants/constants.js
You will need to add the django CSRF cookie name in /var/webapps/fleio/frontend/site/constants/constants.js
and
/var/webapps/fleio/frontend/site/staff/constants/constants.js
...
djangoCsrf: {
'cookieName': 'csrfback',
'headerName': 'X-CSRFToken'
},
...
After that you need to create the frontend nginx configuration file:
vi /etc/nginx/conf.d/domain.tld.conf
server {
listen 80;
client_max_body_size 5000m;
server_name domain.tld;
location /images {
alias /var/webapps/fleio/frontend/site/images/;
break;
}
location /js {
alias /var/webapps/fleio/frontend/site/js/;
expires max;
break;
}
location /vendor {
alias /var/webapps/fleio/frontend/site/vendor/;
expires max;
break;
}
location /styles {
alias /var/webapps/fleio/frontend/site/styles/;
expires max;
break;
}
location /reseller {
alias /var/webapps/fleio/frontend/reseller/;
expires -1;
try_files $uri $uri/ /../reseller/index.html;
}
location /staff {
alias /var/webapps/fleio/frontend/site/staff/;
expires -1;
try_files $uri $uri/ /staff/index.html;
}
location /newstaff {
alias /var/webapps/fleio/frontend/staff/;
expires -1;
try_files $uri $uri/ /../staff/index.html;
}
location / {
alias /var/webapps/fleio/frontend/site/;
expires -1;
try_files $uri $uri/ /index.html;
}
}
Lastly you need to check the Nginx configuration using nginx -t
command. If everything is ok you can restart it using
the following command:
systemctl restart nginx