DOMENIUL / PROGRAMUL DE STUDIU – REȚELE ȘI SOFTWARE ÎN TELECOMUNICAȚII FORMA DE ÎNVĂȚĂMÂNT – ZI Proiect de diplomă COORDONATOR ȘTIINȚIFIC PROF .UNIV… [618838]

ORADEA
2017 UNIVERSITATEA DIN ORADEA
FACULTATEA DE INGINERIE ELECTRICĂ ȘI
TEHNOLOGIA INFORMAȚIEI
DOMENIUL / PROGRAMUL DE STUDIU – REȚELE ȘI
SOFTWARE ÎN TELECOMUNICAȚII
FORMA DE ÎNVĂȚĂMÂNT – ZI

Proiect de diplomă

COORDONATOR ȘTIINȚIFIC
PROF .UNIV .DR.ING SORIN CURILĂ

ABSOLVENT: [anonimizat]

1

CUPRINS

2

Capitolul 1 Introducere

1.1 Descriere

1.2 Motivație

1.3 Sumar

3

Capitolul 2 Tehnologii folosite

2.1 HTML

Tehnologia fundamentala folosită pentru structurarea unei pagin i web este HTML [1][2]
( HyperText MarkUp Language ). HTML este standardul de marcare pentru crearea paginilor ș i
aplicațiilor web.
Construcțiile HTML, imaginile, și alte obiecte, precum și formularele interactive pot fi
încorporate în pagina redată. Aceasta oferă un mijloc de a cr ea documente structurate prin
desemnarea structurata a semanticii pentru text, titluri, paragrafe, liste, imagini, citate și alte
elemente.
Elementele HTML sunt formate din etichete, scrise folosind paranteze unghiulare. Etichete
precum <img /> și <input / > introduc conținut direct în pagină. Altele precum <p>…</p> ,
<div>…</div> înconjoara și oferă informații și pot să conțină alte etichete.

2.2 CSS

Cascading Style Sheet [3][4][5] ( CSS ) este un standard folosit pentru a seta stilul vizual al
paginiilor web și al interfețelor utilizatoriilor scrise în HTML. CSS este o tehnologie de temelie
folosită de majoritatea site -urilor web pentru a creea pagini web cu aspect vizual captivant,
interfețe de utilizator pentru aplicații web și interfețe de utilizator pentr u multe aplicații mobile.
CSS este conceput în primul r ând pentru a permite separarea prezentării și a conținutului,
inclusiv aspecte precum aspectul, culorile, font -urile. Această separare poate îmbunatăți
accesibilitatea conținutului, poate oferi mai mul tă flexibilitate și control în specificațiile

4
caracteristicilor de prezentare, permite mai multor pagini HTML să împărtășească formatarea
specificând CSS -ul relevant într -un fișier separat și reducând complexitatea și repetarea în
conținutul structural.
CSS are o sintaxa simplă și utilizează un număr de cuvinte cheie în limba engleză pentru a
specifica numele diferitelor proprietăți ale stilului. Un style sheet constă dintr -o listă de reguli.
Fiecare regulă sau set de reguli constă dintr -unul sau mai mulți selectori și un bloc de declarații.

<div style=”color: red;”> Chapter One </div>
<div class=”color -class”> Chapter One </div>

<style>
div {
color: red;
}
.color-class {
color: red;
}
</style>

2.3 JavaScript

JavaScript [6][7][8] este un limbaj ușor, interpretat, orientat pe obiecte și este cel mai bine
cunoscut sub numele de limbaj de scripting pentru paginile web , dar este folosit și î n multe
aplicații non -browser. Este un limbaj de scripting bazat pe prototip care este dinamic și susține
stiluri de programare orientate pe obiecte, imperative și funcționale.
JavaScript rulează pe partea de client a paginii web, care poate fi folosită pentru design /
programa modul în care se comportă paginile web la apariția unui eveniment. JavaScript este
ușor de învățat și este un limbaj puternic de scripting, folosit pentru a controla comportamentul
paginii web.
JavaScript poate ca limbaj procedural și orientat pe obiecte. Obiectele sunt create în mod
programabil in JavaScript, prin atașarea de metode și pro prietăți la alte obiecte goale la timpul de

5
execuție, spre deosebire de definițiile clasei sintactice comune în C++ și JAVA. Odată ce un
obiect a fost construit, acesta poate fi folosit ca un model pentru a crea obiecte similare.
Avantajele JavaS cript:
Mai puțină interacțiune cu serverul : Se poate valida intrarea utilizatorului înainte
de a trimite pagina pe server. Acest lucru economisește traficul serverului, ceea ce
înseamnă o încărcare mai mică pe server.
Feedback imediat către vizitatori : Nu este nec esar să aștepte o reîncărcare a
paginii pentru a vedea dacă au uitat să introducă ceva.
Interactivitate sporită : Se pot crea interfețe care reacționează atunci când
utilizatorul se deplasează cu mouse -ul peste ele sau activându -le prin intermediul
tastatur ii.
Interfețe mai bogate : Puteti utiliza JavaScript pentru a include elemente precum
tragere și plasare (drag -and-drop) și sliders pentru a oferii o interfață bogată vizitatorilor
site-ului.

2.3.1 jQuery

jQuery [9][10] este o libră rie a JavaScriptului. Scopu l acestei librării este de a face mult mai
ușor navigarea documentelor HTML, selectarea elementelor, crearea animațiilor, gestionarea
evenimentelor și dezvoltarea aplicațiilor.
jQuery se ocupă de multe sarcini comune care necesită multe linii de cod JavaSc ript pentru a
le realiza și le împachetează în metode pe care le puteți apela cu o singură linie de cod.

6
2.4 Bootstrap

Bootstrap [11] este un framework ( schelet ) open -source JavaScript dezvoltat de echipa de la
Twitter. Este o combinație de cod HTML, CSS și JavaScript proiectat pentru a ajuta la crearea
componentelor interfeței utilizatorilor. Bootstrap a fost de asemenea, programat să suporte atât
HTML5, cât și CSS3. De asemenea se numește și Front -end-framework.
Bootstrap este o colecție gratuită de instrumente pentru crearea unui site web și a aplicațiilor
web. Acesta conține șabloane de design HTML și CSS pentru navigație , butoane, formulare,
alerte, simboluri, etichete, tipografie și alte componente de interfață, precum și extensii
JavaScript opțio nale.
Unele motive pentru care programatorii aleg Bootstrap :
1. Este ușor de utilizat
2. Un sistem de sită împărțit pe doisprezece coloane.
3. Elemente de bază pentru majoritatea elementelor HTML ( Tipgrafie, Cod,
Tabele, Formulare, Butoane, Imagini, Icoane).
4. Listă extinsă de componente.

7

2.5 SQL

SQL [12][13] ( Structured Query Language ) este un limbaj de programare standardizat și
utilizat pentru gestionarea bazelor de date relaționale și efectuarea diferitelor operații asupra
datelor din ele. SQL este folosit în mod regulat de administratorii de baze de date, precum și
dezvoltatorii care scriu scripturi de integrare a datelor și analiști de date care doresc să creeze și
să execute interogări analitice.
SQL oferă doua avantaje principale. În primul rând, a introdus conceptul de accesare a mai
multor înregistrări cu o singură comandă. În al doilea rând a eliminat nevoia de a specifica cum
se ajunge la o înregistrare, de exemplu cu sau fără indice.
Utilizările SQL includ modificarea tabelei de baze de date și a struct urilor indice. Adaugare,
actualizare și stergerea rândurilor de date și preluarea subseturilor de informații dintr -o bază de
date pentru procesarea tranzacțiilor și pentru aplicațiile de analiză. Interogările și alte operații
SQL iau forma comenzilor scr ise ca instrucțiuni.
Instrucțiunile SQL utilizate in mod obișnuit includ selectarea, adaugarea, inserarea,
actualizarea, ștergerea, crearea, modificarea și trunchierea.

8

2.6 ASP.NET

ASP.NET [14][15] este un model de dezvoltare web care include serviciile ne cesare pentru a
construi aplicații web de clasă cu un minim de codificare. ASP.NET face parte din .NET
Framework, iar când se scrie cod în aplicațiile ASP.NET, se pot accesa clase din .NET
Framework. Se poate scrie cod în orice limba compatibilă cu limbaju l de rulare comun, inclusiv
Microsoft Visual Basic și C#.
Aceste limbaje de programare vă permit să dezvoltați aplicații ASP.NET care beneficiază de
modul de funcționare a limbajului comun, de tipul de siguranță și asa mai departe.
ASP.NET funcționează îm preună cu protocolul HTTP și utilizează comenzile și politicile
HTTP pentru a stabili o comunicare și cooperare bilaterală între browser și server.
ASP.NET este folosit pentru a produce aplicații web interactive, bazate pe date, pe internet.
Se compune din tr-un număr mare de comenzi, cum ar fi blocurile de text, butoanele și etichetele
pentru asamblarea, configurarea și manipularea codului pentru a crea pagini HTML.

2.6.1 ASP.NET WebForms

Formularele web ASP.NET prelungesc modelul de interacțiune cu aplicații le web. Browser –
ul trimite un formular web către serverul web, iar serverul returnează o pagină completă de
marcare sau o pagină HTML ca răspuns.
Toate activitățiile utilizatoriilor de pe partea clientului sunt redirecționate către server pentru
a fi proce sate. Serverul procesează rezultatele acțiunilor clientului și produce reacțiile.

9
2.6.2 ASP.NET Component Model

Modelul de componentă ASP.NET oferă diferite blocuri de construcție a paginilor
ASP.NET.
ASP.NET este o tehnologie care funcționează în cadrul .N ET care conține toate
funcționalitățiile legate de web. Framework -ul .NET este alcătuit dintr -o ierarhie orientată pe
obiecte. Fiecare pagină ASP.NET este un obiect și toate componentele sale, precum
controalerele de pe server care sunt de asemenea, obiect e.

10

2.7 ASP.NET C ore

ASP.NET Core [16][17][18] este un framework pentru toate platformele, de înaltă
performanță, open -source pentru construirea de aplicații moderne, bazate pe cloud, conectate la
internet. Aplicațiile ASP.NET Core pot rula pe .NET Core sau pe întregul .NET Framework. A
fost proiectat pentru a oferii un cadru de dezvoltare optimizat pentru aplicațiile care sunt
implementate în cloud sau care rulează local. Se compune din componente modulare cu un nivel
minim de control, astfel încât să se păs treze flexibilitatea în timp ce se crează soluții. Există
posibilitatea să dezvoltăm și să rulăm aplicațiile principale ASP.NET pe platforme precum
Window, Mac și Linux.

2.7.1 ASP.NET C ore MVC

MVC [19][20] ( Model -View -Controller ) este un model arhitectur al care separă o aplicație
în trei grupe principale de componente : Models, Views și Controller . Utilizând acest models,
requesturi -le făcute de catre utilizatori sunt direcționate către un controler care este responsabil
împreună cu modelul pentru a efe ctua acțiuni de utilizator și a prelua rezultatele interogărilor.

11

Controller -ul alege View -ul pentru a fi afișat utilizatorului și îi servește toate datele din
Models pe care îl solicită.
Models într-o aplicație MVC reprezintă starea aplicației și or ice logică de afaceri sau
operațiuni care ar trebui să fie efectuate de aceasta. Logica de afaceri ar trebui încapsulată în
models , împreună cu orice logică de implementare pentru persistența stării aplicației. View -urile
vor folosi cu certitudine tipuril e ViewModel proiectate special pentru a conține datele de afișat in
acel View. Controlerul va crea și va popula aceste i nstanțe de ViewModel din model.

View -urile sunt responsabile pentru prezentarea conținutului utilizatorului cu ajutorul
interfeței. Pen tru a incopora codul .NET în limbajul de marcare HTML se folosește un View
Engine numit R azor. Este nevoie de o logică minimă în cadrul View -ului și orice logică ar trebui
să se refere la prezentarea conținutului. Dacă se simte nevoia de a executa o mare p arte din
logică în fișierul View pentru a afișa date dintr -un model complex, se recomandă utilizarea unui
șablon ViewModel, ViewComponent pentru a simplifica vizualizarea.

View
Controller
Model

12
Controller -ele sunt componente care manipulează interacțiunea cu utilizatorul, lucr ează cu
model -urile și în cele din urma selectează un view pentru prezentarea conținutului către
utilizator.
În aplicația MVC, view -ul se ocupă de afișarea informației, controller -ul se ocupă și
răspunde la interacțiunea utilizatorilor. În modelul MVC controller -ul este responsabil pentru
selectarea tipurilor de model cu care să lucreze și a vizualizării acestora.

2.8 Entity Framework

Entity Framework [21][22] este setul de API -uri .NET pentru efectuarea accesului la date.
Entity Framework se încadrează într -o cateogrie de tehnologie de acces la date numită ORM (
Object Relation Mappers.
ORM sunt concepute pentru a reduce fricțiunea dintre modul în care sunt structurate datele
în baza de date relațională și modul în care vă definiți clasele. Fară ORM trebuie să scrieți o
mulțime de coduri pentru a transforma rezultatele bazei de date în instanțe ale claselor din
software -ul nostru.
Un ORM ne permite să ne exprimăm interogările utilizând clasele noastre și apoi ORM
construiește și execută SQL -ul relavant pentr u noi precum și materializarea obiectelor din datele
care au revenit din baza de date. Entity Framework este diferit de multe ORM -uri pe care le
cunoașteți. În timp ce un ORM tipic deduce că, clasele și tabel ele de baze de date au o structură
similară, Entity Framework are un strat de legături între ele și ne oferă mult mai multă
flexibilitate în ceea ce privește modul de obținere a obiectelor la tabele și de la proprietăți le unui
obiect la coloane de tabel, iar pentru aceste legături , Entity Framework începe cu unele ipoteze și
noi ne referim la acele ca niște convenții pentru a fi siguri că într -un scenariu specific, datele sunt
capabile să își găsească drumul înainte și înapoi între obiecte și baza de date.
Așadar, de ce un ORM peste alte modalități de a face accesul la date și de ce acest ORM, de
ce Entity Framework?
Folosirea unui ORM poate elimina într -adevăr o serie de sarcini reduntante. Entity
Framework poate spori cu adevărat productivitatea developer ilor.

13

De asemenea, asigură coerența în sarcina pe acera o face în loc să aibă diverși membri ai
echipei să își inventeze propriile mijloace de proiectare a accesului la date. Mai degrabă decît să
scrieți SQL -ul relevant pentr u a viza baza de date relațională cu care lucrați, Entity Framework
folosește sintaxa LINQ, care face parte din cadrul .NET.
LINQ -to-Entities permite dezvoltatorilor să utilizeze o limbă de interogare consistentă și
puternică, indiferent de baza de date pe care o țintesc. În plus, LINQ -to-Objects este folosit
pentru interogarea altor elemente ale .NET, chiar și obiecte în memorie, deci developerii
beneficiază de cunoștințele lor despre LINQ, indeferent daca folosesc LINQ -to-Entities, LINQ –
to-Objects sau alt tip de LINQ.
Utilizarea unui ORM permite developeriilor să se concentreze pe domeniul lor, regulile lor
de afaceri și obiectele lor de afaceri.

2.9 RAZOR View Engine

Un concept important de înțeles despre Razor este acela că este pur și simplu o
implement are mai abstractă a conceptului de View engine în MVC.
Razor View Engine este View engine implicit al MVC -ului. Razor oferă o mulțime de
caracteristici care îl fac eficient și ușor de utilizat, cum ar fi fișierele de aspect, metode de ajutor,
vederi, vede ri parțiale și multe altele. Combinația dintre clasele de bază View Engine și aceste
instrumente sunt ceea ce generează în cele din urmă vederi și standarul de marcare. Domeniu Mappings Database Schema

14
Razor oferă multe caracteristici puternice de productivitate care se integrează cu cel elalte
straturi ale MVC -ului.

15

Capitolul 3 Implementarea aplicației

3.1 Arthitectura

Aplicația a fost scrisă sub forma unei aplicații web folosind framework -ul MVC creat de
Microsoft, ASP.NET Core. Folosind structura MVC, se ușurează modul de lucru și permite
modifi carea cu ușurință a aplicației din cauza separării de roluri a fiecărei entități.

3.1.1 Înregistrare și autentificare

ASP.NET Core pune la dispoziție un sistem simplu de autentificare și înregistrare numit
ASP Identity [23]. Acest sistem a fost implementat pe ntru înlocuirea unui sistem mai vechi
ASP.NET Membership și Simple Membership.
ASP Identity oferă în mod implicit suport pentru rol -urile utilizatorilor, management de
profil, schimbare de parolă, mecanism pentru autentificare prin doi pași, integrare cu s ervicii
externe de socializare cum ar fii Facebook, Google etc.
Este posibilă extinderea sistemului prin modificarea mecanismului de stocare unde implicit
este folosit EntityFramework Core, prin integrare cu OAuth [24], poate fi extins prin ASP.NET
Core mi ddleware [25].
La crearea șablon -ului pentru acest proiect, sa optat pentru mecanismul de autentificare și
înregistrare normal prin ASP Identity, iar conturile utilizatorilor vor fi stocate în aceeași bază de
date folosită de restul aplicației. O alta alter nativă la acest sistem este integ rarea cu Azure Active
Directory[ 26], care permite ca datele utilizatorilor să nu fie păstrate în același sistem crescând
nivelul de securitate dar în același timp și timpul de dezvoltare și complexitatea proiectului. În

16
cazul de față a fost aleasă prima variantă deoarece aplicația nu este destul de complexă să
necesite un sistem mai complex și securizat de management al cont -urilor.
Folosind structura MVC, aplicația creată adaugă două controller -e AccountController și
respec tiv ManageController. AccountController este folosit pentru autentificare și înregistrarea
utilizatorilor.

a) Pentru autentificare se apelează Login( LoginViewModel mode, string returnUrl =
null ) în cadrul AccountController din formularul de autentificare. În acest pas se poate
verifica daca utilizatorul a optat pentru autentificare prin doi pași sau dacă cumva
contul a fost blocat din cauza unor autentificări anterioare care au eșuat, însă această
opțiune poate fii dezactivată. În următoarea secvență de co d se apelează serviciul
SignInManager pentru autentificare prin parolă.

var result = await _signInManager.PasswordSignInAsync(model.Email,
model.Password, model.RememberMe, lockoutOnFailure: false );

Această metodă nu va arunca nici o excepție, dar o să returneze un obiect care va
conține proprietăți necesare pentru a verifica daca autentificarea a fost cu succes
if ( result.Succeeded ) .
Dacă se necesită autentificare prin doi pași, se poate verifica prin accesarea proprietății
RequiresTwoFactor . În cazul în care sistemul necesită autentificarea prin doi pași,
utilizatorul va fi redirecționat la acțiunea LoginWith2fa( bool rememberMe, string
returnUrl = null ) .

b) Înregistrarea utilizatorilor se face apelând Register( RegisterViewModel model,
string re turnUrl = null ) din AccountController. În cazul unei înregistrări cu succes,
utilizatorul poate primii un e -mail prin care să își poată confirma contul.

17
Următoarea secvență de cod este folosită pentru a crea contul de utilizator

var result = await _ userManager.CreateAsync(user, model.Password);
if (result.Succeeded)
{
_logger.LogInformation("User created a new account with password.");

var code = await _userManager.GenerateEmailConfirmationTokenAsync(user);
var callbackUrl = Url.EmailCo nfirmationLink(user.Id, code, Request.Scheme);
await _emailSender.SendEmailConfirmationAsync(model.Email, callbackUrl);

await _signInManager.SignInAsync(user, isPersistent: false);
_logger.LogInformation("User created a new account with password. ");
return RedirectToLocal(returnUrl);
}

c) Management de profil este sec țiunea unde utilizatorii găsesc detaliile despre profilul
contului cum ar fii, schimbarea de parolă, schimbarea de e -mail , numarul de telefon,
verificarea contului pe e -mail etc. accesând Manage profile de pe bara de meniu.
Schimbarea de parolă se face apelând ChangePassword(
ChangePasswordViewModel model ) din ManageController. În cazul unei schimbări

18
de parolă cu succes , utilizatorul va primii un mesaj pozitiv informându -l că, p arola sa
schimbat cu succes.
Pentru trimiterea unui e -mail de verificare a contului se apelează
SendVerificationEmail( IndexViewModel model ) . Utilizatorul va fii informat când
a fost trimit un email pentru verificare . Email -ul la care este trimis, este a cela care sa
setat la crearea contului sau cel care a fost actualizat în cazul în care sa optat pentru
această opțiune.
Asocierea contului din sistem cu un cont existent de la serviciile externe de socializare
precum Facebook, Google, Instagram etc. se va face apelând LinkLogin( string
provide ). Dacă nu se întâmpină nici o problemă utilizatorul va fii informat de
adăugarea acestei asocieri. Pe server se face verificarea dată iar sistemul permite
autentificării cu Facebook, Google etc, iar în cod se face ve rificarea pentru a afișa link
în meniul de pe pagina de management.

_ManageNav.cshtml
@if ( hasExternalLogins ) {
<li class=”@ManageNavPages.ExternalLoginsNavClass(ViewContext)”>
<a asp-action=”ExternalLogins”>External logins</a></li>
}

19

Bibliografie
[1] https://teamtreehouse.com/library/what -is-html – Consultat la 09.10.2017
[2] https://www.w3schools.com/htm l/html_intro.asp – Consultat la 09.10.2017
[3] https://www.w3schools.com/css/css_intro.asp – Consultat la 10.10.2017
[4] https://en.wikipedia.org/wiki/Cascading_Style_Sheets – Consultat la 10.10.2017
[5] https://developer.mozilla.org/en –
US/docs/Learn/CSS/Introduction_to_CSS/How _CSS_works – Consultat la 10.10.2017
[6] https://developer.mozilla.org/en -US/docs/Web/JavaScript/About_JavaScript –
Consultat la 28.10.2017
[7] https://www.w3schools.com/js/js_intro.asp – Consultat la 7.11.2017
[8] https://www.tutorialspoint.com/javascript/javascript_overview.htm – Consultat la
7.11.2017
[9] https://jquery.com/ – Consultat la 22.11.2017
[10] http://api.jquery.com/ – Consultat la 22.11.2017
[11] https://stackoverflow.com/questions/14546709/what -is-bootstrap – Consultat la
02.12.2017
[12] http://www.sqlcourse.com/intro.html – Consultat la 03.12.2017
[13] https://www.w3schools.com/sql/sql_intro.asp – Consultat la 03.12.2017
[14] Glenn Block, Pablo Cibraro, Pedro Felix, Howard Dierking, Darrel Miller. 2014.
„Designing Evolvable Web APIs with ASP.NET”
[15] https://docs.microsoft.com/en -us/aspnet/overview – Consultat la 10.12.2017
[16] https://docs.microsoft.com/en -us/aspnet/co re/ – Consultat la 17.12.2017
[17] https://docs.microsoft.com/en -us/aspnet/core/tutorials/index – Consultat la
17.12.2017
[18] https://github.com/aspnet/Home – Consultat la 05.01.2018
[19] https://docs.microsoft.com/en -us/aspnet/core/mvc/overview – Consultat la
08.01.2018
[20] https://en.wikipedia.org/wiki/ASP.NET_MVC – Consultat la 08.01.2018
[21] Julia, Lerman. 2010. „Programming EntityFramework, 2nd Edition”

20
[22]https://app.pluralsight.com/library/courses/entity -framework -core-getting –
started/table -of-contents – Consultat la 08.01.2018
[23] https://www.asp.net/ide ntity – Consultat la 0 5.01.2018
[24] https://docs.microsoft.com/en -us/aspnet/aspnet/overview/owin -and-katana/owin –
oauth -20-authorization -server – Consultat la 0 5.01.2018
[25] https://docs.microsoft.com/en –
us/aspnet/core/fundamentals/middleware?tabs=aspnetcore2x – Consultat la 09.01.2018
[26] https://docs.microsoft.com/en -us/aspnet/identity/overview/getting –
started/de veloping -aspnet -apps-with-windows -azure -active -directory – Consultat la
09.01.2018

21

ANEXE