Crearea unui formular simplu de contact folosind Angularjs și php. Cum se face ca atributul necesar pentru intrare să funcționeze în versiunile mai vechi de IE? 6 autentificare folosind numele necesar

Salutare băieți, sperăm că lucrurile merg bine, astăzi vă vom explica un tutorial foarte util. În tutorialul de astăzi vom crea un formular simplu de contact folosind angularJS și php.

Formularul de contact este o pagină web standard care este disponibilă pe fiecare site web. Acest lucru permite vizitatorilor site-ului să contacteze proprietarii site-ului sau furnizorii de servicii care sunt responsabili pentru întreținerea site-ului respectiv. Așa că ne-am gândit de ce să nu creăm un simplu formular de contact cu folosind Angularjsși php pentru a primi mesaje de la site-uri web, cititori și/sau utilizatori.

Folosim Angularjs pentru front end și php pe partea de server. Vom scrie cod în php care preia date dintr-un formular Angular și le trimite prin e-mail administratorului site-ului. Creați un folder numit „contact-form” în directorul aplicației dvs. web și creați un exemplu de design Pagini HTML– index.html. Acum copiați și inserați codul de mai jos în fișierul index.html.

Demo - Formular simplu de contact folosind Angularjs și php Formular de contact folosind angularjs și PHP Numele tău E-mail Mesaj Trimite

Cod PHP a trimite E-mail

Creați o pagină contact.php și copiați și lipiți codul de mai jos. Mai jos este codul php care va prelua datele din formularul unghiular și le va trimite prin e-mail la adresa de e-mail specificată.

< ?php $post_data = file_get_contents("php://input"); $data = json_decode($post_data); //Just to display the form values echo "Name: " . $data->Nume; echo "E-mail: " . $date->email; echo "Mesaj: " . $date->mesaj; // a trimis un e-mail $la = $date->email; $subject = "Site de scrisoare de testare pentru testarea formularului de contact angularjs"; $mesaj = $date->mesaj; $headers = "De la: " . $date->nume .. "\r\n" .. "\r\n" . „X-Mailer: PHP/” . phpversion(); //funcţie e-mail PHP pentru a trimite e-mail la adresa de e-mail mail($to, $subject, $message, $headers); ?>

De ce am primit acest formular?

În prezent, există un atac de forță brută pe site-ul dvs. Un atac cu forță brută este un atac de ghicire a parolei. În acest caz, o parolă este selectată pentru panoul administrativ al site-ului dvs.

Pentru a preveni piratarea site-ului dvs. și pentru a crește securitatea acestuia, am instalat protecție suplimentară.

Cum pot accesa acum panoul de administrare al site-ului?

Acum, la accesarea panoului administrativ al site-ului dvs. (pe Joomla sau WordPress), va apărea o fereastră suplimentară pentru introducerea login-ului și a parolei cu inscripția „vă rugăm să utilizați parola panoului de control”. Ca logare, trebuie să introduceți autentificarea serviciului dvs. de găzduire, arată ca „u1234567”. Parola este parola curentă pentru serviciul dvs. de găzduire.

După ce ați trecut autentificarea HTTP de bază, veți vedea un câmp standard de conectare în panoul de administrare al site-ului dvs. Acum va trebui să introduceți numele și parola administratorului site-ului.

Cum funcționează autentificarea de bază HTTP

Când introduceți parola de conectare în fereastra de autentificare de bază, valorile hash de conectare și parolă vor fi comparate cu valorile din dosar special~/etc/users , disponibil în panoul de control al găzduirii. Conținutul fișierului arată cam așa: „u1234567:dm48bspxIO3rg” . Unde „u1234567” este login și „dm48bspxIO3rg” este hash-ul parolei (notă: doar hash-ul, nu parola în sine!). Un hash de parolă este rezultatul conversiei unei parole folosind un algoritm specific.

Astfel, atunci când introduceți numele de utilizator și parola în fereastra de autentificare de bază, se ia un hash al parolei introduse și se compară cu valoarea hash din fișierul ~/etc/users. Dacă valorile se potrivesc, ești autentificat.

Nu pot trece autentificarea de bază

Probabil ați introdus o parolă greșită. Instalare Parolă Nouă pentru autentificarea de bază:

Dacă ați trecut autentificarea de bază, dar nu vă puteți conecta direct la panoul de administrare al site-ului dvs. Joomla sau WordPress, utilizați ajutorul:

Cum să creșteți protecția site-ului dvs. împotriva atacurilor cu forță brută?

Pentru a crește securitatea site-ului:

• schimbați autentificarea superutilizatorului într-una mai unică. Nu folosiți nume scurte, este mai bine dacă folosiți prenumele împreună cu numele de familie. Există multe resurse pe Internet unde sunt colectate cele mai populare autentificări. Familiarizați-vă cu ele și nu le folosiți niciodată;
• Setați o parolă complexă de administrator de site. O parolă complexă trebuie să conțină litere mari și mici, numere și simboluri suplimentare, cum ar fi „* - _ # :”, etc. Lungimea parolei nu este mai mică de 6 caractere. De preferință 10 și peste.

Cum să eliminați formularul de autentificare de bază HTTP?

Pentru a elimina formularul de autentificare de bază HTTP:

AuthType Basic AuthName „te rugăm să folosești parola panoului de control” AuthUserFile .../utilizatori Solicită un utilizator valid

Pentru a comenta o linie, puneți un simbol hash (“#”) la începutul liniei, astfel.

Postat pe 23 octombrie la 23:15.

Utilizarea verificării numelui de utilizator pentru a crește securitatea contului

Ca măsură suplimentară de securitate, vă punem la dispoziție un sistem de verificare a numelui de utilizator pentru a spori securitatea contului pe anumite pagini EA, inclusiv pe pagina Contului dvs. EA.

• Atenție jucători FIFA: această funcție necesare pentru a accesa serverele FIFA Ultimate Team și aplicațiile partenere.

Această măsură de securitate este concepută pentru a împiedica oamenii să se conecteze la contul dvs. EA de pe dispozitive necunoscute fără o parolă și fără verificarea numelui dvs. de utilizator. Notificările vor fi trimise pe telefonul mobil sau pe e-mailul la alegere. Procesul de verificare a numelui de utilizator creează coduri digitale temporare de acces pentru fiecare utilizator specific este necesar să vă conectați la contul dvs. cu dispozitiv necunoscut.

Activați verificarea numelui de utilizator

1. Accesați ea.com și conectați-vă.

2. Faceți clic pe numele dvs. de utilizator, apoi selectați „Contul meu”.

3. Selectați fila Securitate, unde puteți găsi secțiunea Verificare nume de utilizator.

4. Faceți clic pe Activare pentru a activa verificarea numelui de utilizator, introduceți întrebarea de securitate și selectați una dintre opțiuni: e-mail, aplicație de identitate sau SMS pentru a primi un cod de verificare.

• Dacă selectați opțiunea „E-mail” în loc de SMS, asigurați-vă că adresa de e-mail furnizată pentru contul dvs. este o adresă validă și funcțională pe care o verificați în mod regulat pentru mesaje noi.
• O aplicație de identificare pentru tablete și telefoane mobile vă permite să generați coduri de verificare pe acele dispozitive pentru a vă conecta la contul dvs.
• Selectați tipul dvs. de dispozitiv din lista derulantă și descărcați Google Authenticator pentru dispozitivele Apple și Android sau Authenticator pentru dispozitivele care utilizează sistem de operare Windows.
• Jucătorii FIFA 15 de pe PlayStation 3 și Xbox 360 nu vor trebui să ia măsuri de securitate suplimentare atunci când își verifică numele de utilizator cu aplicația de autentificare.

5. Acum veți primi un cod de verificare când încercați să vă conectați de pe un dispozitiv necunoscut. La fiecare 90 de zile, veți primi un cod de verificare atunci când vă conectați la contul dvs. de pe dispozitive de încredere. Deci numai tu poți ajuta cod unic va putea accesa contul dvs. EA.

Dacă este necesar, confirmarea numelui de utilizator poate fi dezactivată; pentru a face acest lucru, reveniți la pagina de gestionare contși selectați „Dezactivați”.*

Notă

• *Nu dezactivați verificarea numelui de utilizator dacă jucați FIFA Ultimate Team, altfel vi se va refuza accesul.
• Asigurați-vă că ați creat și confirmat Intrebare secretași răspunsul la acesta pentru jocul FIFA Ultimate Team.

Configurați aplicația de identificare

Aplicația de identificare este cea mai bună cale rapidă verificați-vă în siguranță identitatea. Configurați o aplicație de identificare pe dvs dispozitiv mobil pentru a vă conecta folosind codul pe care îl generează pentru identificarea în doi pași.

1. Deschideți fila Securitate din pagina Contul meu și găsiți secțiunea Verificare nume de utilizator.

2. Faceți clic pe Activare pentru a activa Verificarea numelui de utilizator, răspundeți la întrebarea de securitate, selectați Aplicație de identitate și faceți clic pe Continuare.

3. Selectați sistemul de operare al telefonului de care aveți nevoie din lista derulantă și scanați codul QR utilizând o aplicație de citire a codurilor de bare sau căutați în magazinul de aplicații telefonul dvs. pentru autentificator pentru aplicația corespunzătoare: Google Authenticator pe Android și iOS sau Authenticator pe Windows Telefon.

4. Deschideți aplicația de identificare și selectați opțiunea de a adăuga manual un cont.

5. Scanați codul QR sau introduceți cod secret pentru a vă conecta aplicația de identitate la contul dvs. EA.

6. Finalizați configurarea aplicației de identificare introducând codul pe care l-a generat pentru contul dvs. Electronic Arts și făcând clic pe „Activați verificarea numelui de utilizator”.

Când trebuie să vă verificați numele de utilizator în viitor:

1. Deschideți aplicația de identificare.

2. Introduceți codul din șase cifre pentru contul dvs. Electronic Arts.

Codul generat este valabil pentru o perioadă limitată de timp. Dacă codul curent expiră deja, așteptați până când se generează aplicația cod nou ca să ai timp suficient să-l intri.

Ce ar trebui să fac dacă nu îl pot folosi? telefon mobil sau e-mail când am nevoie de un cod? Este posibil să generați coduri de ajutor?

Dacă telefonul, actul de identitate sau e-mail nu sunt disponibile pentru dvs., singura modalitate de a vă conecta la contul dvs. EA de pe un computer necunoscut este prin utilizarea codurilor de ajutor. Asigurați-vă că le depozitați într-un loc sigur și accesibil pentru dvs. Puteți vizualiza și actualiza aceste coduri în contul dvs. EA, sub Setări de confidențialitate din clientul Origin sau online.

• Faceți clic pe „Securitate”, apoi „Vizualizare” și „Coduri de ajutor”.*
• De asemenea, puteți utiliza funcția „Solicitați un cod nou după conectarea la FIFA Ultimate Team”.

*Dacă rămâneți fără coduri de asistență, puteți genera altele noi pe pagina Gestionare cont.

A confirma informații de contact pentru a vă asigura că codul este corect.

Dacă întâmpinați dificultăți cu codul de verificare a numelui de utilizator, vă rugăm să vă asigurați că adresa de e-mail sau numărul de telefon sunt introduse corect. Când utilizați un identificator, asigurați-vă că programul este instalat corect.

• Dacă ați ales să trimiteți un cod la adresa dvs. de e-mail atunci când ați activat verificarea numelui de utilizator, puteți verifica și actualiza adresa de e-mail în secțiunea Despre mine a paginii dvs. de gestionare a contului sau prin clientul Origin.
• Dacă selectați Identity App, puteți utiliza un cod de bare sau un cod QR pentru a scana și a căuta codul între ?secret= și &.
• Dacă ați selectat opțiunea de a trimite un cod prin SMS la activarea verificării numelui de utilizator, puteți verifica și actualiza numărul de telefon în secțiunea Securitate a paginii de gestionare a contului sau prin clientul Origin.
• Creați sau confirmați o întrebare de securitate și un răspuns.

După ce vă confirmați informațiile de contact, veți avea opțiunea de a activa verificarea numelui de utilizator pentru a primi un nou cod.

Când construiești aplicații web, este important să iei în serios securitatea, mai ales când trebuie să te ocupi de obținerea de date de la utilizatori.

O regulă generală de securitate este să nu ai încredere în nimeni, așa că nu te poți baza pe utilizatori să introducă întotdeauna valorile corecte în formulare. De exemplu, în loc să introducă adresa de e-mail corectă în câmp, utilizatorul poate introduce o adresă incorectă sau chiar unele date rău intenționate.

Când vine vorba de validarea datelor utilizatorului, aceasta se poate face fie pe partea client (în browser web), fie pe partea serverului.

Anterior, validarea pe partea clientului se putea face doar cu folosind JavaScript. Însă totul s-a schimbat (sau aproape s-a schimbat), întrucât cu ajutorul HTML5 validarea se poate face în browser, fără a fi nevoie să scrieți scripturi complexe de validare în JavaScript.

Validarea formularului folosind HTML5

HTML5 oferă un mecanism destul de robust bazat pe următoarele atribute de etichetă: tip, model și necesită. Cu aceste noi atribute, puteți descărca o parte din funcționalitatea de validare a datelor în browser.

Să ne uităm la aceste atribute pentru a înțelege cum pot ajuta la validarea formularelor.

atribut tip

Acest atribut indică ce câmp de intrare să fie afișat pentru procesarea datelor, de exemplu câmpul familiar, cum ar fi

Unele câmpuri de introducere oferă deja metode standard validare fără a fi nevoie să scrieți cod suplimentar. De exemplu, verifică un câmp pentru a se asigura că valoarea introdusă se potrivește cu șablonul unei adrese de e-mail valide. Dacă într-un câmp este introdus un caracter incorect, formularul nu poate fi trimis până când valoarea nu este corectată.

Încercați să jucați cu valorile câmpurilor de e-mail din demonstrația de mai jos.

Există și alte tipuri de câmpuri standard, cum ar fi , și pentru validarea numerelor, adreselor URL și, respectiv, numerelor de telefon.

Notă: Formatul numărului de telefon diferă pentru tari diferite din cauza unei nepotriviri a numărului de cifre din numerele de telefon și a diferențelor de formate. Ca urmare, specificația nu definește un algoritm pentru verificarea numerelor de telefon, așa că la momentul scrierii această ocazie prost suportat de browsere.

Din fericire pentru noi, validarea numărului de telefon se poate face folosind atributul pattern, care ia ca argument o expresie regulată, la care ne vom uita în continuare.

atribut model

Atributul model va face probabil mulți dezvoltatori front-end să sară de bucurie. Acest atribut acceptă o expresie regulată (similară cu formatul expresii obisnuite JavaScript), care va verifica corectitudinea datelor introduse în câmp.

Expresiile regulate sunt un limbaj folosit pentru a analiza și manipula textul. Ele sunt adesea folosite pentru operațiuni complexe de căutare și înlocuire, precum și pentru verificarea corectitudinii datelor introduse.

Astăzi, expresiile regulate sunt incluse în cele mai populare limbaje de programare, precum și în multe limbaje de scripting, editori, aplicații, baze de date și utilitare de linie de comandă.

Expresiile regulate (RegEX) sunt un instrument puternic, concis și flexibil pentru potrivirea unui șir de text, cum ar fi caractere individuale, cuvinte sau modele de caractere.

Transmițând o expresie regulată ca valoare a atributului modelului, puteți specifica ce valori sunt acceptabile pentru a acestui domeniu de intrare, precum și informarea utilizatorului despre erori.

Să ne uităm la câteva exemple de utilizare a expresiilor regulate pentru a valida valoarea câmpurilor de intrare.

Numere de telefon

După cum am menționat mai devreme, tipul câmpului tel nu este pe deplin acceptat de browsere din cauza inconsecvențelor în formatele numerelor de telefon din diferite țări.

De exemplu, în unele țări formatul numerelor de telefon este reprezentat ca xxxx-xxx-xxxx , iar număr de telefon va fi cam asa: 0803-555-8205.

Expresia regulată cu care se potrivește acest model este: ^\d(4)-\d(3)-\d(4)$ . În cod acest lucru poate fi scris astfel:

Număr de telefon:

Valori alfanumerice Atribut necesar

Acesta este un atribut boolean folosit pentru a indica faptul că valoarea unui anumit câmp trebuie completată pentru a trimite formularul. Când adăugați acest atribut într-un câmp, browserul va solicita utilizatorului să completeze acest câmp înainte de a trimite formularul.

Acest lucru ne scutește de implementarea validării câmpului folosind JavaScript, ceea ce poate economisi timp dezvoltatorilor.

De exemplu: sau (pentru compatibilitatea XHTML)

Toate demonstrațiile pe care le-ați văzut mai sus folosesc atributul necesar, astfel încât să îl puteți încerca încercând să trimiteți formularul fără a completa niciun câmp.

Concluzie

Suportul de browser pentru validarea formularelor este destul de bun, iar pentru browserele mai vechi puteți utiliza polyfills.

Este demn de remarcat faptul că bazarea doar pe validarea browser-ului este periculoasă, deoarece aceste verificări pot fi ocolite cu ușurință de către atacatori sau roboți.

Nu toate browserele acceptă HTML5 și nu toate datele trimise către scriptul dvs. vor veni din formularul dvs. Aceasta înseamnă că înainte de a accepta în sfârșit datele de la utilizator, este necesar să verificați corectitudinea acestora pe partea de server.

Pentru orice dezvoltator web, în ​​prezent nu există nicio problemă mai serioasă decât compatibilitatea completă între browsere a produsului său. Aceasta este probabil una dintre sarcinile principale ale unui bun specialist: să se asigure că site-ul său este întotdeauna afișat corect în toate browserele.

Parametrul necesar, care este uneori folosit pentru intrare, nu funcționează în IE antic, care pur și simplu nu poate fi lăsat așa. Utilizatorii pensionari care încă folosesc IE6 ar trebui să aibă aceeași ușurință de utilizare ca și utilizatorii site-ului dvs Google Chrome ultima versiune. Cine, pe lângă dezvoltatorii web, se poate ocupa de ei.

Despre lucruri dureroase, oh Internet Explorer

Pentru browserele normale, care includ Firefox, Opera și Google Chrome, această sarcină este relativ ușoară. Chiar și versiunile mai vechi ale acestor browsere afișează codul HTML la fel de bine, cu excepția cazului în care, desigur, sunt folosite unele tehnologii noi. Dar pentru a realiza acest lucru în browserele din familia Internet Explorer, sunt necesare eforturi pur și simplu herculeene.

Fiecare versiune a browserului Internet Explorer are propria sa prostie unică. Ceea ce funcționează în IE6 poate să nu funcționeze corect în IE7 și invers. Microsoft nu a putut depăși această grădină zoologică nici măcar în cea mai recentă versiune a browserului său.

Nu înțeleg de ce dezvoltatorii de browser nu pot să deschidă și să citească standardele W3C pentru construirea de site-uri web.

Prin urmare, ca dezvoltator web, trebuie să acționez ca un fel de „strat” între browserele capricioase și vizitatorii site-ului care au nevoie de cunoștințe și spectacol. Și este grozav că dezvoltatorii web au reușit să facă asta până acum.

Deci, cum pot fi obligat să lucrez în versiuni mai vechi de IE?

JS ne vine în ajutor. Anterior, nu puteam suporta, dar acum nu văd o cale ulterioară fără ea în întinderea WEB-ului „corect”.

Soluția dată mai jos nu am inventat-o ​​eu, ci am luat-o de pe un blog burghez. Din moment ce sunt lacom și blogul este burghez, nu voi oferi un link către el.

Funcția fnCheckFields() va fi responsabilă pentru tot. Plasați codul JS pe site-ul dvs.:

funcția fnCheckFields(form_obj)( var error_msg = "Vă rugăm să completați toate câmpurile obligatorii."; var is_error = false; for (var i = 0; form_obj_elem = form_obj.elements[i]; i++) if (form_obj_elem.type "input" || form_obj_elem.type "text") if (form_obj_elem.getAttribute("obligatoriu") && !form_obj_elem.value) is_error = true; if (is_error) alert(error_msg); return !is_error; )

De obicei, este recomandat să-l plasați între etichetele html HEAD la începutul paginii, dar aș recomanda totuși să-l plasați în partea de jos a paginii înainte de eticheta BODY de închidere. În acest fel, JS are un impact mai mic asupra vitezei de încărcare a paginii.

Fereastra de introducere în care ar trebui să fie introdus parametrul necesar ar trebui să arate astfel în html:

Acest script funcționează foarte simplu: după ce faceți clic pe butonul Trimitere, scriptul verifică toate intrările pentru prezența parametrului necesar și, dacă îl găsește, se uită corespunzător la valoarea introdusă a acestui câmp. Dacă nu este introdus nimic într-o astfel de intrare, este afișată o fereastră de avertizare despre necesitatea introducerii. În consecință, datele nu sunt trimise nicăieri.

De asemenea, este grozav că, dacă aveți un browser normal care a învățat deja să înțeleagă acest parametru așa cum era de așteptat, o astfel de fereastră de avertizare nu va apărea și va funcționa unelte standard procesarea parametrului necesar pentru browserul dvs.

Distribuie pe rețelele sociale retelelor