A webalkalmazások létrehozásakor fontos komolyan venni a biztonságot, különösen akkor, ha a felhasználóktól származó adatok megszerzésével kell foglalkozni.

Általános biztonsági szabály, hogy senkiben sem szabad megbízni, ezért nem bízhat abban, hogy a felhasználók mindig a megfelelő értékeket írják be az űrlapokba. Például ahelyett, hogy a megfelelő e-mail címet írná be a mezőbe, a felhasználó helytelen címet írhat be, vagy akár rosszindulatú adatokat is megadhat.

Amikor a felhasználói adatok érvényesítéséről van szó, azt akár a kliens oldalon (a webböngészőben), akár a szerver oldalon lehet elvégezni.

Korábban az ügyféloldali érvényesítést csak JavaScript használatával lehetett elvégezni. De minden megváltozott (vagy majdnem megváltozott), mert a HTML5 segítségével a böngészőben is elvégezhető az érvényesítés, anélkül, hogy JavaScriptben kellene bonyolult validációs szkripteket írni.

Űrlapérvényesítés HTML5 használatával

A HTML5 meglehetősen robusztus mechanizmust biztosít a következő címkeattribútumok alapján: típus, minta és követelmény. Ezekkel az új attribútumokkal az adatellenőrzési funkciók egy részét átrakhatja a böngészőbe.

Nézzük meg ezeket az attribútumokat, hogy megértsük, hogyan segíthetnek az űrlap érvényesítésében.

típusú attribútum

Ez az attribútum megmondja, hogy melyik beviteli mezőt kell megjeleníteni az adatfeldolgozáshoz, például az ismert mezőt

Néhány beviteli mező már megadja szabványos módszerekérvényesítés, írás nélkül kiegészítő kód. Például ellenőrzi egy mezőt, hogy megbizonyosodjon arról, hogy a megadott érték megegyezik a megfelelő mintával email címeket. Ha helytelen karaktert írnak be egy mezőbe, az űrlapot nem lehet elküldeni az érték javításáig.

Próbáljon meg játszani az e-mail mező értékeivel az alábbi demóban.

Vannak más szabványos mezőtípusok is, például a számok, URL-ek és telefonszámok érvényesítésére.

Megjegyzés: A telefonszám formátuma eltérő lehet különböző országokban a telefonszámok számjegyeinek eltérése és a formátumbeli eltérések miatt. Ennek eredményeként a specifikáció nem határoz meg algoritmust a telefonszámok ellenőrzésére, így a cikk írásakor ezt a lehetőséget a böngészők rosszul támogatják.

Szerencsére a telefonszám-ellenőrzés elvégezhető a minta attribútum használatával, amely egy reguláris kifejezést vesz argumentumként, amelyet a következőkben nézünk meg.

minta attribútum

A minta attribútum valószínűleg sok front-end fejlesztőt ugrál majd örömében. Ez az attribútum egy reguláris kifejezést fogad el (hasonlóan a JavaScript reguláris kifejezés formátumához), amely a mezőbe beírt adatok helyességének ellenőrzésére szolgál.

A reguláris kifejezések a szöveg elemzésére és manipulálására használt nyelvek. Gyakran használják összetett keresési és csere műveletekhez, valamint a bevitt adatok helyességének ellenőrzésére.

Manapság a reguláris kifejezések megtalálhatók a legnépszerűbb programozási nyelvekben, valamint számos szkriptnyelvben, szerkesztőben, alkalmazásban, adatbázisban és parancssori segédprogramban.

A reguláris kifejezések (RegEX) hatékony, tömör és rugalmas eszköz a szöveges karakterláncok, például az egyes karakterek, szavak vagy karakterminták egyeztetésére.

Ha a minta attribútum értékeként egy reguláris kifejezést ad át, megadhatja, hogy egy adott beviteli mezőben milyen értékek elfogadhatók, valamint tájékoztathatja a felhasználót a hibákról.

Nézzünk meg néhány példát a reguláris kifejezések használatára a beviteli mezők értékének ellenőrzésére.

Telefonszámok

Mint korábban említettük, a tel mező típusát a böngészők nem támogatják teljes mértékben a telefonszám-formátumok különböző országokban tapasztalható következetlenségei miatt.

Például egyes országokban a telefonszámok formátuma xxxx-xxx-xxxx , és a telefonszám ez valami ilyesmi lesz: 0803-555-8205.

A reguláris kifejezés, amelyre ez a minta illeszkedik: ^\d(4)-\d(3)-\d(4)$ . A kódban ez így írható:

Telefonszám:

Alfanumerikus értékek Az attribútum kötelező

Ez egy logikai attribútum, amely azt jelzi, hogy egy adott mező értékét ki kell tölteni az űrlap elküldéséhez. Amikor hozzáadja ezt az attribútumot egy mezőhöz, a böngésző megköveteli a felhasználótól, hogy töltse ki ezt a mezőt az űrlap elküldése előtt.

Ezzel megkímél minket attól, hogy a JavaScript használatával végrehajtsuk a mezőellenőrzést, ami némi időt takaríthat meg a fejlesztőknek.

Például: vagy (XHTML-kompatibilitásért)

A fent látott demók mindegyike használja a kötelező attribútumot, így kipróbálhatja úgy, hogy megpróbálja elküldeni az űrlapot mezők kitöltése nélkül.

Következtetés

A böngésző támogatása az űrlapérvényesítéshez elég jó, a régebbi böngészőkhöz pedig polifilleket is használhat.

Érdemes megjegyezni, hogy önmagában a böngészőoldali érvényesítésre hagyatkozni veszélyes, mivel ezeket az ellenőrzéseket a támadók vagy a botok könnyen megkerülhetik.

Nem minden böngésző támogatja a HTML5-öt, és nem minden, a szkriptbe küldött adat származik az űrlapról. Ez azt jelenti, hogy mielőtt véglegesen elfogadnánk az adatokat a felhasználótól, ellenőrizni kell azok helyességét a szerver oldalon.

Feladás dátuma: október 23., 23:15.

Felhasználónév-ellenőrzés használata a fiók biztonságának növelésére

További biztonsági intézkedésként egy felhasználónév-ellenőrző rendszert biztosítunk a fiók biztonságának fokozása érdekében bizonyos EA-oldalakon, beleértve az Ön EA-fiókját is.

• FIFA játékosok figyelmébe: ezt a funkciót szükséges a FIFA Ultimate Team szervereinek és partneralkalmazásainak eléréséhez.

Ennek a biztonsági intézkedésnek az a célja, hogy megakadályozza, hogy az emberek jelszó és felhasználónév ellenőrzése nélkül ismeretlen eszközökről bejelentkezzenek EA-fiókjába. Az értesítéseket az Ön által választott mobiltelefonjára vagy e-mail címére küldjük. A felhasználónév-ellenőrzési folyamat során ideiglenes digitális kódok hozzáférés minden egyes felhasználó számára, amely szükséges ahhoz, hogy egy ismeretlen eszközről bejelentkezzen egy fiókba.

Felhasználónév-ellenőrzés engedélyezése

1. Nyissa meg az ea.com webhelyet, és jelentkezzen be.

2. Kattintson a felhasználónevére, majd válassza a "Fiókom" lehetőséget.

3. Válassza a Biztonság lapot, ahol a Felhasználónév ellenőrzése részt találja.

4. Kattintson az Engedélyezés lehetőségre a felhasználónév-ellenőrzés engedélyezéséhez, írja be a biztonsági kérdést, és válasszon a lehetőségek közül: e-mail, személyazonossági alkalmazás vagy SMS az ellenőrző kód fogadásához.

• Ha az "E-mail" lehetőséget választja az SMS helyett, győződjön meg arról, hogy a fiókhoz megadott címet adja meg email- Ez egy érvényes és működő cím, amelyen rendszeresen ellenőrzi az új üzeneteket.
• A táblagépekhez és mobiltelefonokhoz készült azonosító alkalmazás lehetővé teszi, hogy ellenőrző kódokat generáljon ezeken az eszközökön a fiókjába való bejelentkezéshez.
• Válassza ki az eszköz típusát a legördülő listából, és töltse le Google Authenticator Apple és Android készülékekhez vagy Authenticatort használó eszközökhöz operációs rendszer Windows.
• A PlayStation 3 és Xbox 360 rendszeren futó FIFA 15 játékosoknak nem kell további biztonsági intézkedéseket tenniük, amikor a hitelesítő alkalmazással igazolják felhasználónevüket.

5. Mostantól kap egy ellenőrző kódot, amikor ismeretlen eszközről próbál bejelentkezni. 90 naponta kap egy ellenőrző kódot, amikor megbízható eszközökről jelentkezik be fiókjába. Tehát csak te tudsz segíteni egyedi kód hozzáférhet az EA-fiókjához.

Ha szükséges, a felhasználónév megerősítése letiltható. Ehhez térjen vissza a kezelőoldalra fiókotés válassza a "Letiltás" lehetőséget.*

Jegyzet

• *Ne tiltsa le a felhasználónév ellenőrzését, ha FIFA Ultimate Team-et játszik, különben megtagadják a hozzáférést.
• Ne felejtsen el létrehozni és megerősíteni egy biztonsági kérdést és választ a FIFA Ultimate Team számára.

Állítsa be az azonosító alkalmazást

Azonosító alkalmazás a leginkább gyors út biztonságos pénztár a személyiséged. Állítson be egy hitelesítési alkalmazást a készülékén mobil eszközön hogy az általa generált kóddal jelentkezzen be a kétlépcsős azonosításhoz.

1. Nyissa meg a Biztonság lapot a Fiókom oldalon, és keresse meg a Felhasználónév ellenőrzése részt.

2. Kattintson az Engedélyezés gombra a felhasználónév-ellenőrzés engedélyezéséhez, válaszoljon a biztonsági kérdésre, válassza az Identity Application lehetőséget, majd kattintson a Folytatás gombra.

3. Válassza ki a kívánt telefon operációs rendszert a legördülő listából, és olvassa be a QR-kódot egy vonalkód-olvasó alkalmazással, vagy keresse meg a megfelelő alkalmazást a telefon alkalmazásboltjában a hitelesítéshez: Google Hitelesítő Android és iOS rendszeren vagy Authenticator Windows Phone rendszeren .

4. Nyissa meg az azonosítási alkalmazást, és válassza ki a fiók manuális hozzáadásának lehetőségét.

5. Olvassa be a QR-kódot, vagy írja be titkos kód hogy összekapcsolja személyazonossági alkalmazását EA-fiókjával.

6. Fejezze be az azonosító alkalmazás beállítását úgy, hogy beírja az Electronic Arts-fiókjához generált kódot, majd kattintson a „Felhasználónév-ellenőrzés engedélyezése” gombra.

Amikor a jövőben igazolnia kell felhasználónevét:

1. Nyissa meg az azonosító alkalmazást.

2. Adja meg Electronic Arts fiókjának hatjegyű kódját.

A generált kód korlátozott ideig érvényes. Ha a jelenlegi kódja már hamarosan lejár, várja meg, amíg az alkalmazás új kódot generál, hogy elegendő ideje legyen annak megadására.

Mit tegyek, ha nem tudom használni? mobiltelefon vagy e-mailben, ha kódra van szükségem? Lehetséges súgókódokat generálni?

Ha telefonod, személyi igazolványod ill email nem elérhetők, az egyetlen módja annak, hogy ismeretlen számítógépről bejelentkezzen EA-fiókjába, a súgókódok használatával. Ügyeljen arra, hogy biztonságos és elérhető helyen tárolja őket. Ezeket a kódokat megtekintheti és frissítheti EA-fiókjában az Origin kliens Adatvédelmi beállításai alatt vagy online.

• Kattintson a „Biztonság”, majd a „Nézet” és a „Súgókódok” elemre.*
• Használhatja az „Új kód kérése a FIFA Ultimate Teambe való bejelentkezés után” funkciót is.

*Ha kifogy a támogatási kódokból, a Fiókkezelés oldalon hozhat létre újakat.

Erősítse meg elérhetőségei hogy megbizonyosodjon a kód helyességéről.

Ha problémába ütközik a felhasználónév-ellenőrző kóddal, ellenőrizze, hogy helyesen adta-e meg e-mail címét vagy telefonszámát. Ha azonosítót használ, győződjön meg arról, hogy a program megfelelően van telepítve.

• Ha úgy döntött, hogy kódot küld az e-mail-címére, amikor aktiválta a felhasználónév-ellenőrzést, ellenőrizheti és frissítheti e-mail címét a Fiókkezelés oldal Névjegy szakaszában vagy az Origin kliensen keresztül.
• Ha az Identity App lehetőséget választja, vonalkód vagy QR-kód segítségével szkennelheti és keresheti a kódot a ?titkos= és & között.
• Ha a felhasználónév-ellenőrzés aktiválásakor azt a lehetőséget választotta, hogy SMS-ben küldjön kódot, akkor a fiókkezelési oldal Biztonság részében vagy az Origin kliensen keresztül ellenőrizheti és frissítheti telefonszámát.
• Hozzon létre vagy erősítsen meg egy biztonsági kérdést és válaszoljon rá.

Miután megerősítette kapcsolatfelvételi adatait, lehetősége nyílik arra, hogy engedélyezze a felhasználónév ellenőrzését, hogy új kódot kapjon.

Bármely webfejlesztő számára jelenleg nincs komolyabb probléma, mint termékének teljes böngésző-kompatibilitása. Valószínűleg ez az egyik fő feladata egy jó szakembernek: biztosítani, hogy weboldala mindig minden böngészőben helyesen jelenjen meg.

A szükséges paraméter, amelyet néha bevitelre használnak, nem működik az ősi IE-ben, amit egyszerűen nem lehet így hagyni. A nyugdíjas felhasználók, akik még mindig IE6-ot használnak, ugyanolyan könnyen használhatónak találják az Ön webhelyét Google felhasználók Chrome legújabb verziók. Akik a webfejlesztők mellett vigyázhatnak rájuk.

A fájdalmas dolgokról, oh Internet Explorer

Normál böngészőkhöz, köztük Firefox, Opera és Google Chrome, ez a feladat viszonylag egyszerű. Ezeknek a böngészőknek a régebbi verziói is ugyanolyan jól jelenítik meg a HTML-kódot, hacsak természetesen nem használnak új technológiákat. De ennek eléréséhez az Internet Explorer család böngészőiben egyszerűen herkulesi erőfeszítésekre van szükség.

Mindegyik verzió Internet böngésző Az Explorernek megvan a maga egyedi hülyesége. Ami az IE6-ban működik, előfordulhat, hogy nem működik megfelelően az IE7-ben és fordítva. A Microsoft ezt az állatkertet még a legkevésbé sem tudta legyőzni legújabb verziója a böngészőjét.

Nem értem, hogy a böngészőfejlesztők miért nem tudják megnyitni és elolvasni a W3C weboldal-építési szabványokat.

Ezért webfejlesztőként egyfajta „rétegként” kell fellépnem a szeszélyes böngészők és a tudást, látványt igénylő oldallátogatók között. És nagyszerű, hogy a webfejlesztőknek ez eddig sikerült.

Tehát hogyan lehet kötelezni az IE régebbi verzióiban való munkát?

JS a segítségünkre van. Korábban nem bírtam elviselni, most viszont nem látok enélkül további utat a „helyes” WEB kiterjedésében.

Az alábbi megoldást nem magam találtam ki, hanem egy polgári blogról vettem. Mivel kapzsi vagyok és polgári a blog, ezért nem adok hozzá linket.

Mindenért az fnCheckFields() függvény lesz felelős. Helyezze el a JS-kódot webhelyén:

function fnCheckFields(form_obj)( var error_msg = "Kérjük, töltse ki az összes kötelező mezőt."; 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("required") && !form_obj_elem.value) is_error = true if (is_error) alert(error_msg);

Általában az oldal elején a HEAD html címkék közé javasolt elhelyezni, de továbbra is azt javaslom, hogy az oldal aljára, a záró BODY címke elé. Így a JS kevésbé befolyásolja az oldal betöltési sebességét.

A beviteli ablaknak, ahová a szükséges paramétert be kell írni, így kell kinéznie html-ben:

Ez a szkript nagyon egyszerűen működik: a Submit gombra kattintás után a szkript minden bemenetben ellenőrzi a szükséges paraméter meglétét, és ha megtalálja, ennek megfelelően megnézi a mező beírt értékét. Ha nem ír be semmit egy ilyen bevitelbe, egy figyelmeztető ablak jelenik meg a bevitel szükségességéről. Ennek megfelelően az adatokat nem küldik sehova.

Szintén nagyszerű, hogy ha egy normál böngészővel rendelkezik, amely már megtanulta értelmezni ezt a paramétert a várt módon, akkor egy ilyen figyelmeztető ablak nem jelenik meg, és működni fognak a böngészőben szükséges paraméterek feldolgozására szolgáló szabványos eszközök.

Oszd meg a közösségi médiában hálózatok

Miért kaptam ezt az űrlapot?

IN jelen pillanat Brute-force támadást hajtanak végre webhelyén. A brute-force támadás jelszó kitaláló támadás. Ebben az esetben a rendszer egy jelszót választ ki a webhely adminisztrációs paneljéhez.

A webhelye feltörésének megelőzése és biztonságának növelése érdekében további védelmet telepítettünk.

Hogyan férhetek hozzá a webhely adminisztrációs paneljéhez?

Most, amikor eléri webhelye adminisztrációs paneljét (Joomla vagy WordPress rendszeren), látni fogja kiegészítő ablak beírja bejelentkezési nevét és jelszavát a „kérjük, használja a vezérlőpult jelszavát” felirattal. Bejelentkezésként meg kell adnia tárhelyszolgáltatásának bejelentkezési adatait, ez így néz ki: „u1234567”. A jelszó a tárhelyszolgáltatás jelenlegi jelszava.

Az alapvető HTTP hitelesítés átadása után egy szabványos bejelentkezési mező jelenik meg webhelye adminisztrációs panelén. Most meg kell adnia a webhely rendszergazdai bejelentkezési nevét és jelszavát.

Hogyan működik a HTTP alapszintű hitelesítés

Amikor megadja bejelentkezési jelszavát az alap hitelesítési ablakban, a bejelentkezési és a jelszó hash értékei összehasonlításra kerülnek a speciális fájl~/etc/users , elérhető a tárhely vezérlőpultján. A fájl tartalma valahogy így néz ki: „u1234567:dm48bspxIO3rg” . Ahol az „u1234567” a bejelentkezés, a „dm48bspxIO3rg” pedig a jelszókivonat (megjegyzés: csak a hash, magát a jelszót nem!). A jelszókivonat a jelszó egy adott algoritmussal történő átalakításának eredménye.

Így amikor megadja felhasználónevét és jelszavát az alap hitelesítési ablakban, a rendszer a beírt jelszó kivonatát veszi, és összehasonlítja a ~/etc/users fájl hash értékével. Ha az értékek egyeznek, Ön hitelesítve van.

Nem tudom átadni az alapvető hitelesítést

Valószínűleg rossz jelszót ad meg. Telepítés Új jelszó alap hitelesítéshez:

Ha átment az alapszintű hitelesítésen, de nem tud közvetlenül bejelentkezni Joomla vagy WordPress webhelye adminisztrációs paneljére, használja a súgót:

Hogyan növelheti webhelye védelmét a brute force támadásokkal szemben?

A webhely biztonságának növelése érdekében:

• módosítsa a szuperfelhasználói bejelentkezést egy egyedibbre. Ne használjon rövid neveket, jobb, ha az utónevet a vezetéknévvel együtt használja. Az interneten számos forrás található, ahol a legnépszerűbb bejelentkezési adatokat gyűjtik össze. Ismerkedjen meg velük, és soha ne használja őket;
• Állítson be egy összetett webhely rendszergazdai jelszót. Az összetett jelszónak tartalmaznia kell kis- és nagybetűket, számokat és további szimbólumokat, például „* - _ # :” stb. A jelszó hossza legalább 6 karakter. Lehetőleg 10 és több.

Hogyan lehet eltávolítani a HTTP alapszintű hitelesítési űrlapot?

A HTTP alapszintű hitelesítési űrlap eltávolítása:

AuthType Basic AuthName "kérjük, használja a vezérlőpult jelszavát" AuthUserFile .../users Valid-user szükséges

Egy sor megjegyzéséhez tegyen egy hash szimbólumot („#”) a sor elejére, így.

Sziasztok srácok remélem jól mennek a dolgok, ma egy nagyon hasznos oktatóanyagot fogunk elmagyarázni veletek. A mai oktatóanyagban egy egyszerű kapcsolatfelvételi űrlapot fogunk létrehozni angularJS és php használatával.

A kapcsolatfelvételi űrlap egy szabványos weboldal, amely minden webhelyen elérhető. Ez lehetővé teszi a webhely látogatói számára, hogy kapcsolatba lépjenek a webhely tulajdonosaival vagy szolgáltatóival, akik felelősek a webhely karbantartásáért. Ezért arra gondoltunk, miért ne hoznánk létre egy egyszerű kapcsolatfelvételi űrlapot az Angularjs és a php használatával, hogy üzeneteket kapjunk webhelyektől, olvasóktól és/vagy felhasználóktól.

A kezelőfelülethez Angularjs-t, szerver oldalon pedig php-t használunk. A kódot php-ban írjuk, amely egy Angular űrlapból veszi az adatokat, és e-mailben elküldi az oldal adminisztrátorának. Hozzon létre egy „kapcsolatfelvételi űrlap” nevű mappát a webalkalmazás könyvtárában, és hozzon létre egy mintát HTML oldalak– index.html. Most másolja ki és illessze be az alábbi kódot az index.html fájlba.

Demo - Egyszerű kapcsolatfelvételi űrlap Angularjs és php használatával Kapcsolatfelvételi űrlap angularjs és PHP használatával Az Ön neve E-mail Üzenet Küldés

Php kód e-mail küldéshez

Hozzon létre egy contact.php oldalt, és másolja be az alábbi kódot. Alul található a php kód, amely lekéri az adatokat a szögletes formáról, és elküldi e-mailben a megadott e-mail címre.

< ?php $post_data = file_get_contents("php://input"); $data = json_decode($post_data); //Just to display the form values echo "Name: " . $data->név; echo "E-mail: " . $adat->e-mail; echo "Üzenet: " . $adat->üzenet; // e-mailt küldött $to = $data->email; $subject = "Tesztlevél oldal az angularjs teszteléséhez kapcsolatfelvételi űrlap"; $message = $data->message; $headers = "Feladó: " . $adat->név .. "\r\n" .. "\r\n" . "X-Mailer: PHP/" . Phpversion();

Választás