You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
238 lines
10 KiB
238 lines
10 KiB
5 years ago
|
= Covid 19 Graphs Web Application
|
||
|
|
||
|
==== ΠΑΝΕΠΙΣΤΗΜΙΟ ΔΥΤΙΚΗΣ ΑΤΤΙΚΗΣ
|
||
|
==== Υπολογιστική Νέφους και Υπηρεσίες
|
||
|
|
||
|
|
||
|
====== Τσαμαντιώτης Ηρακλής cs130004
|
||
|
====== Μπίνας Γεώργιος cs130001
|
||
|
|
||
|
|
||
|
|
||
|
:sectnums:
|
||
|
|
||
|
== Περιγραφή
|
||
|
Στα πλαίσια του εργαστηρίου Υπολογιστικής Νέφους και Υπηρεσίες υλοποιήθηκε μία web εφαρμογή η οποία παρέχει στον χρήστη ενημέρωση σχετικά με την κατάσταση της πανδημίας με την μορφή γραφημάτων. Ο χρήστης έχει την δυνατότητα να επιλέξει και να φιλτράρει τα αποτελέσματα βάση ημερομηνίας, ηπείρου και χώρας. Τα αποτελέσματα εμφανίζονται σε κατάλληλα γραφήματα τα οποία μπορούν να απεικονίσουν τα διαφορετικά κριτήρια που επιθυμεί ο χρήστης.
|
||
|
|
||
|
|
||
|
== Τεχνολογίες - Αρχιτεκτονικές
|
||
|
|
||
|
Η εφαρμογή έχει αναπτυχθεί σε php και javascript και χρησιμοποιεί MySql database για την αποθήκευση των δεδομένων.
|
||
|
Για την ανάπτυξη της χρησιμοποιήθηκε η αρχιτεκτονική των Microservices. Χρησιμοποιείται Docker για το deploy ολων των επιμέρους στοιχείων (services) που χρειάζεται η εφαρμογή για να λειτουργεί και όλα αυτα τρέχουν ως services σε ένα swarm.
|
||
|
|
||
|
=== Docker
|
||
|
|
||
|
Σε δύο Vitrual Machines εχει εγκατατασταθεί Docker και έχουν σεταριστεί ώστε να δουλεύουν σε swarm mode. Ο ένας είναι ο manager και ο άλλος o worker.
|
||
|
Έχουν δημιουργηθεί 4 nodes, 2 στον manager και 2 στον worker.
|
||
|
|
||
|
=== Database
|
||
|
|
||
|
Για την αποθήκευση των δεδομένων που χρειάζεται η εφαρμογή χρησιμοποιείτε MySql database η οποία τρέχει ως service και δεν γίνεται replicated.
|
||
|
|
||
|
=== RestFull WebServices Application
|
||
|
|
||
|
Για την λήψη δεδομένων απο την database έχουν δημιουργηθεί Rest Web Services σε php τα οποία επιστρέφουν τα δεδομένα σε μορφή JSON. Υπάρχουν 12 Web Services τα οποία τρέχουν σε apache server ο οποίος έχει γίνει replicated σε 4 nodes.
|
||
|
|
||
|
|
||
|
=== Front Application
|
||
|
|
||
|
Για την παρουσίαση των δεδομένων στον τελικό χρήστη έχει δημιουργηθεί ένα front end application σε php και javascript χρησιμοποιώντας Bootstrap JQuery και ApexCharts. Η εφαρμογή αυτή παρέχει τις σελίδες οι οποίες είναι διαθέσιμες στον τελικό χρήστη. Η κλήση στα rest services γίνεται κατευθείαν απο τον client και τα γραφήματα σχεδιάζονται με την χρήση του ApexCharts. Η εφαρμογή τρέχει σε apache server ο οποίος έχει γίνει replicated σε 4 nodes.
|
||
|
|
||
|
=== Proxy
|
||
|
|
||
|
Έχει γίνει deploy ένασ NGINX server o οποίος έχει γίνει replicated σε 4 nodes. Ο συγκεκριμένος server λειτουργεί ως proxy server. Παρέχει το ssl και κάνει την δρομολόγηση στην κατάλληλη εφαρμογή (Front Application, RestFull WebServices Application) ανάλογα με το path στο url.
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
== Installation
|
||
|
Για την εγκατάσταση της εφαρμογής υλοποιήθηκε το παρακάτω .yaml αρχείο το οποίο θα πρέπει να γίνει deploy απο τον manager του swarm.
|
||
|
[source,yaml]
|
||
|
version: "3.4"
|
||
|
services:
|
||
|
proxy:
|
||
|
image: nginx:1.17.9-alpine
|
||
|
deploy:
|
||
|
mode: replicated
|
||
|
restart_policy:
|
||
|
delay: 10s
|
||
|
max_attempts: 10
|
||
|
window: 60s
|
||
|
replicas: 4
|
||
|
placement:
|
||
|
# max_replicas_per_node: 1
|
||
|
constraints:
|
||
|
- node.labels.group==server
|
||
|
ports:
|
||
|
- "8080:80"
|
||
|
- "9443:443"
|
||
|
volumes:
|
||
|
- /home/user/project_cloud/proxy.conf:/etc/nginx/conf.d/default.conf
|
||
|
- /home/user/project_cloud/public.crt:/etc/nginx/public.crt
|
||
|
- /home/user/project_cloud/private.key:/etc/nginx/private.key
|
||
|
networks:
|
||
|
- covid_19
|
||
|
mysql_database:
|
||
|
image: mysql:latest
|
||
|
command: --default-authentication-plugin=mysql_native_password
|
||
|
environment:
|
||
|
MYSQL_ROOT_PASSWORD: [DATABASE ROOT PASSWORD]
|
||
|
ports:
|
||
|
- 3306:3306
|
||
|
volumes:
|
||
|
- mysql_database:/var/lib/mysql
|
||
|
adminer_container:
|
||
|
image: adminer:latest
|
||
|
environment:
|
||
|
ADMINER_DEFAULT_SERVER: mysql_db_container
|
||
|
ports:
|
||
|
- 6060:8080
|
||
|
apache2_application:
|
||
|
image: my_apache:0.1
|
||
|
deploy:
|
||
|
mode: replicated
|
||
|
restart_policy:
|
||
|
delay: 10s
|
||
|
max_attempts: 10
|
||
|
window: 60s
|
||
|
replicas: 4
|
||
|
placement:
|
||
|
# max_replicas_per_node: 1
|
||
|
constraints:
|
||
|
- node.labels.group==server
|
||
|
volumes:
|
||
|
- /home/user/project_cloud/application_php/www:/var/www/html
|
||
|
ports:
|
||
|
- 90:80
|
||
|
networks:
|
||
|
- covid_19
|
||
|
apache2_client:
|
||
|
image: my_apache:0.1
|
||
|
deploy:
|
||
|
mode: replicated
|
||
|
restart_policy:
|
||
|
delay: 10s
|
||
|
max_attempts: 10
|
||
|
window: 60s
|
||
|
replicas: 4
|
||
|
placement:
|
||
|
# max_replicas_per_node: 1
|
||
|
constraints:
|
||
|
- node.labels.group==server
|
||
|
volumes:
|
||
|
- /home/user/project_cloud/client/www:/var/www/html
|
||
|
ports:
|
||
|
- 91:80
|
||
|
networks:
|
||
|
- covid_19
|
||
|
volumes:
|
||
|
mysql_database:
|
||
|
networks:
|
||
|
covid_19:
|
||
|
driver: overlay
|
||
|
secrets:
|
||
|
secret_key:
|
||
|
external: true
|
||
|
access_key:
|
||
|
external: true
|
||
|
|
||
|
Στον ίδιο φάκελο του project υλοποιήθηκε το αρχείο proxy.conf το οποίο είναι το configuration για τον proxy server. Επίσης στον φάκελο αυτό υπάρχουν τα private και public keys για την υλοποίηση του ssl.
|
||
|
|
||
|
[source,conf]
|
||
|
proxy_cache_path /var/tmp levels=1:2 keys_zone=my_cache:10m max_size=10g inactive=60m use_temp_path=off;
|
||
|
server {
|
||
|
listen 80;
|
||
|
server_name name.example.org;
|
||
|
return 301 https://83.212.77.22$request_uri;
|
||
|
}
|
||
|
server {
|
||
|
listen 443 ssl;
|
||
|
server_name name.example.org;
|
||
|
# To allow special characters in headers
|
||
|
ignore_invalid_headers off;
|
||
|
# Allow any size file to be uploaded.
|
||
|
# Set to a value such as 1000m; to restrict file size to a specific value
|
||
|
client_max_body_size 0;
|
||
|
# To disable buffering
|
||
|
proxy_buffering off;
|
||
|
ssl_certificate /etc/nginx/public.crt;
|
||
|
ssl_certificate_key /etc/nginx/private.key;
|
||
|
ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
|
||
|
ssl_ciphers HIGH:!aNULL:!MD5;
|
||
|
location /application/ {
|
||
|
proxy_cache my_cache;
|
||
|
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_set_header Host $http_host;
|
||
|
proxy_set_header X-NginX-Proxy true;
|
||
|
proxy_ssl_session_reuse off;
|
||
|
proxy_redirect off;
|
||
|
proxy_connect_timeout 300;
|
||
|
# Default is HTTP/1, keepalive is only enabled in HTTP/1.1
|
||
|
proxy_http_version 1.1;
|
||
|
proxy_set_header Connection "";
|
||
|
chunked_transfer_encoding off;
|
||
|
proxy_pass http://apache2_client:80;
|
||
|
# Health Check endpoint might go here. See https://www.nginx.com/resources/wiki/modules/healthcheck/
|
||
|
# /minio/health/live;
|
||
|
}
|
||
|
location /services/ {
|
||
|
proxy_cache my_cache;
|
||
|
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_set_header Host $http_host;
|
||
|
proxy_set_header X-NginX-Proxy true;
|
||
|
proxy_ssl_session_reuse off;
|
||
|
proxy_redirect off;
|
||
|
proxy_connect_timeout 300;
|
||
|
# Default is HTTP/1, keepalive is only enabled in HTTP/1.1
|
||
|
proxy_http_version 1.1;
|
||
|
proxy_set_header Connection "";
|
||
|
chunked_transfer_encoding off;
|
||
|
proxy_pass http://apache2_application:80;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
Για την σύνδεση με την database θα πρέπει να συμπληρωθούν τα σωστά στοιχεία στο αρχείο project_cloud\application_php\www\services\connect.php
|
||
|
[source,php]
|
||
|
<?php
|
||
|
$DB_HOST = [IP];
|
||
|
$DB_NAME = "covid_19_db";
|
||
|
$DB_USER = "root";
|
||
|
$DB_PASSWORD = [DATABASE ROOT PASSWORD];
|
||
|
$CHARSET = 'utf8';
|
||
|
try{
|
||
|
$conn = new PDO("mysql:host=$DB_HOST;port=3306;dbname=$DB_NAME;charset=$CHARSET", $DB_USER, $DB_PASSWORD);
|
||
|
$conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION); // To turn on error mode for debugging errors
|
||
|
$conn->setAttribute(PDO::ATTR_EMULATE_PREPARES, false); // To get maximum sql injection protection
|
||
|
// echo "Connected successfully";
|
||
|
}
|
||
|
catch(PDOException $e){
|
||
|
echo "Connection failed: " . $e->getMessage();
|
||
|
}
|
||
|
?>
|
||
|
|
||
|
Για να μπορεί η Front Application να πάρει δεδομένα απο την RestFull WebServices Application θα πρέπει να σεταριστούν τα σωστά urls στο αρχείο
|
||
|
project_cloud\client\www\application\js\webcall.js
|
||
|
[source,javascript]
|
||
|
var servicesURL = {
|
||
|
getAllCasesGroupByContinent : 'https://83.212.77.22:9443/services/get_all_cases_group_by_continent.php',
|
||
|
getContinents: 'https://83.212.77.22:9443/services/get_continents.php',
|
||
|
getGroupByChooseContinent: 'https://83.212.77.22:9443/services/get_group_by_choose_continent_data.php',
|
||
|
getCountries: 'https://83.212.77.22:9443/services/get_countries.php',
|
||
|
getCountryDataInSpecificDates: 'https://83.212.77.22:9443/services/get_country_data_specific_dates.php',
|
||
|
getLastDate: 'https://83.212.77.22:9443/services/get_last_date.php',
|
||
|
getContinentsDataInSpecificDates: 'https://83.212.77.22:9443/services/get_continent_data_specific_dates.php',
|
||
|
getTotalCasesAndDeaths: 'https://83.212.77.22:9443/services/get_total_cases_deaths.php'
|
||
|
}
|
||
|
|
||
|
== Web Application Covid 19
|
||
|
=== Index.php
|
||
|
image::images/index.PNG[]
|
||
|
|
||
|
=== countryInDates.php
|
||
|
image::images/country.PNG[]
|
||
|
|