În această serie, vom folosi Python, Flask și MySQL pentru a crea o aplicație web simplă de la zero. Acesta va fi o aplicație simplă în lista de cupă, în care utilizatorii se pot înregistra, pot să se conecteze și să-și creeze lista cu cupă.

Acest tutorial presupune că aveți cunoștințe de bază despre Piton limbaj de programare. Vom folosi sticlă, un cadru de aplicații web Python, pentru a crea aplicația noastră, cu MySQL ca spate.

Dacă aveți nevoie să vă periați pe abilitățile dumneavoastră Python, încercați cursul Introducere în Python, care vă oferă o bază solidă în limba pentru doar 5 dolari.

Introducere în Python Flask

Flask este un cadru Python pentru crearea de aplicații web. De pe site-ul oficial,

Flask este o microframework pentru Python bazat pe Werkzeug, Jinja 2 și intenții bune.

Când ne gândim la Python, cadrul de facto care ne vine în minte este cadrul Django. Dar, dintr-o perspectivă a începătorului Python, Flask este mai ușor de început, în comparație cu Django.

Configurarea unui balon

Configurarea Flache este destul de simplă și rapidă. Cu țâfnă manager de pachete, tot ce trebuie să faceți este: 

pip-balon de instalare

Odată ce ați terminat instalarea unui balon, creați un dosar numit FlaskApp. Navigați la FlaskApp și creați un fișier numit app.py. Importați sticlă modul și să creați o aplicație utilizând Flac, după cum se arată:

din importul flaconului Flask app = Flask (__ name__)

Acum definiți ruta de bază / și solicitantul său corespunzător de solicitare:

@ app.route ("/") def main (): retur "Bun venit!"

Apoi, verificați dacă fișierul executat este programul principal și executați aplicația:

dacă __name__ == "__main__": app.run ()

Salvați modificările și executați app.py:

python app.py

Punctați browser-ul dvs. la http: // localhost: 5000 / și ar trebui să aveți mesajul de întâmpinare.

Crearea unei pagini de pornire

În primul rând, când rulează aplicația, ar trebui să afișăm o pagină de pornire cu cele mai recente articole din lista de cupă adăugate de utilizatori. Deci, să adăugăm pagina noastră de pornire în dosarul nostru de aplicații.

Balonul caută fișiere șablon în interiorul template-uri pliant. Deci, navigați la PythonApp și creați un dosar numit template-uri. Interior template-uri, creați un fișier numit index.html. Deschide index.html și adăugați următoarele coduri HTML:

        
 
  
Python Flask App
 
 
 
Lista de aplicații Bucket
  
Înscrie-te astăzi 
 
 
 
 
Chestii de rezolvat în viata asta
 
Donec id elit non mi porta gravida la eget metus. Maecenas faucibus mollis interdum.
 
Chestii de rezolvat în viata asta
 
Morbi leo risus, porta AC consectetur ac, vestibulum la eros. Cros mattis consectetur purus sit amet fermentum.
 
Chestii de rezolvat în viata asta
 
Maecenas sed diam eget risus varius blandit sit amet non magna.
 
 
 
Chestii de rezolvat în viata asta
 
Donec id elit non mi porta gravida la eget metus. Maecenas faucibus mollis interdum.
 
Chestii de rezolvat în viata asta
 
Morbi leo risus, porta AC consectetur ac, vestibulum la eros. Cros mattis consectetur purus sit amet fermentum.
 
Chestii de rezolvat în viata asta
 
Maecenas sed diam eget risus varius blandit sit amet non magna.
 
 
  
  

Deschide app.py și importul render_template, pe care o vom folosi pentru a face fișierele șablon.

din flaconul de import Flask, render_template

Modificați metoda principală pentru a returna fișierul șablon redat.

def principal (): returna render_template ('index.html')

Salvați modificările și reporniți serverul. Punctați browser-ul dvs. la http: // localhost: 5000 / și ar trebui să aveți ecranul de mai jos:

Crearea unei pagini de înscriere

Pasul 1: Configurarea bazei de date

Vom folosi MySQL ca spate. Deci, conectați-vă la MySQL din linia de comandă sau dacă preferați o interfață grafică ca banca de lucru MySQL, puteți folosi și asta. Mai întâi, creați o bază de date numită Chestii de rezolvat în viata asta. Din linia de comandă: 

mysql -u  -p

Introduceți parola dorită și când vă conectați, executați următoarea comandă pentru a crea baza de date:

CREATE DATABASE BucketList;

Odată ce baza de date a fost creată, creați un tabel numit tbl_user așa cum se arată:

(45) NULL, 'user_username' VARCHAR (45) NULL, 'user_password' VARCHAR (45) NULL, KEY PRIMARY ('user_id' )); 

Vom folosi Proceduri stocate pentru ca aplicația noastră Python să interacționeze cu baza de date MySQL. Deci, o dată pe masă tbl_user a fost creat, creați o procedură stocată numită sp_createUser pentru a vă înscrie un utilizator.

Când creați o procedură stocată pentru a crea un utilizator în tbl_user tabel, mai întâi trebuie să verificăm dacă un utilizator cu același nume de utilizator deja exista. Dacă există, trebuie să aruncăm o eroare utilizatorului, altfel vom crea utilizatorul în tabelul de utilizatori. Iată cum este procedeul stocat sp_createUser ar arata:

(20), IN p_username VARCHAR (20), IN p_password VARCHAR (20)) BEGIN daca (selecteaza exista) (selectati 1 din tbl_user unde user_username = p_username)) THEN selectați 'Username Exists !!'; Inserați ELSE în valorile tbl_user (user_name, user_username, user_password) (p_name, p_username, p_password); END IF; END $$ DELIMITER; 

Pasul 2: Creați o interfață de conectare

Navigați la PythonApp / template-uri și creați un fișier HTML numit signup.html. Adăugați următorul cod HTML la signup.html:

         
 
  
Python Flask App
 
 
 
Lista de aplicații Bucket
 
 Nume  Adresa de email  Parola  Inscrie-te 
 
  
   

Adăugați și următoarele CSS la fel de signup.css la dosarul static din interior PythonApp.

corp padding-top: 40px; padding-bottom: 40px; . formă-semnătura max-width: 330px; padding: 15px; marja: 0 auto;  formularul-formular de înscriere-formare-semnare, .form-signin .checkbox margin-bottom: 10px;  .form-signin .checkbox font-greutate: normal;  formular-semnal .formă-control poziție: relativă; înălțime: auto; -webkit-box-size: caseta de frontieră; -moz-box-size: caseta de margine; box-size: caseta de margine; padding: 10px; font-size: 16px;  formularul-formular de control: focus z-index: 2;  .formă-introduceți intrarea [type = "email"] margin-bottom: -1px; raza de jos-dreapta-dreapta: 0; raza de la extremitatea stanga-stanga: 0;  .formă-introduceți intrarea [type = "password"] margin-bottom: 10px; raza de pe raza de sus-stanga: 0; raza de sus-dreapta-dreapta: 0; 

În app.py adăugați o altă metodă numită showSignUp pentru a reda pagina de înscriere odată ce o cerere a ajuns / showSignUp:

@ app.route ('/ showSignUp') def showSignUp (): returnați render_template ('signup.html')

Salvați modificările și reporniți serverul. Faceți clic pe Inscrie-te pe pagina de pornire și ar trebui să aveți pagina de înscriere după cum se arată: 

Pasul 3: Implementați o metodă de înscriere 

Apoi, avem nevoie de o metodă de server pentru ca interfața utilizator să interacționeze cu baza de date MySQL. Deci navigați la PythonApp și deschis app.py. Creați o nouă metodă numită Inscrie-te și adăugați, de asemenea, un traseu /Inscrie-te. Iată cum arată:

@ app.route ('/ signUp') def signUp (): # crea codul de utilizator va fi aici !!

Vom folosi jQuery AJAX pentru a posta datele noastre de înscriere către Inscrie-te , astfel încât să specificăm metoda în definirea rutei.

@ app.route ('/ signUp', methods = ['POST']) def signUp (): # crea codul de utilizator va fi aici !!

Pentru a citi valorile postate trebuie să importăm cerere din Flask.

din balonul de import Flask, render_template, cerere

Utilizarea cerere putem citi valorile afișate după cum se arată mai jos:

@ app.route ('/ signUp', methods = ['POST']) def signUp (): # citiți valorile postate din UI _name = request.form ['inputName'] _email = ] _password = request.form ['inputPassword']

Odată ce valorile sunt citite, vom verifica pur și simplu dacă acestea sunt valide și, pentru moment, să întoarcem doar un simplu mesaj:

@ app.route ('/ signUp', methods = ['POST']) def signUp (): # citiți valorile postate din UI _name = request.form ['inputName'] _email = ] _password = request.form ['inputPassword'] # validează valorile primite dacă _name și _email și _password: returnează json.dumps ('html': 'Toate domeniile sunt bune !!') else: returnează json.dumps (' html ':'Introduceți câmpurile obligatorii„)

De asemenea, importați JSON din Flask, deoarece îl folosim în codul de mai sus pentru a reveni JSON date.

din flacca de import Flask, render_template, json, cerere

Pasul 4: Creați o solicitare de înscriere

Vom folosi jQuery AJAX pentru a trimite cererea de înscriere în metoda Python. Descărcați și locați jQuery interior PythonApp / statice / js și adăugați o legătură la aceasta din pagina de înscriere. Odată ce jQuery a fost inclus, vom adăuga un jQuery POST solicitați când utilizatorul dă clic pe Inscrie-te buton.

Deci, să atașăm evenimentul clic pe butonul de înscriere așa cum este prezentat:

$ (btnSignUp)), faceți clic pe (funcția () $ .ajax (url: '/ signUp', data: $ (' , succes: funcția (răspuns) console.log (răspuns);, eroare: funcție (eroare) console.log (eroare););););

Salvați toate modificările și reporniți serverul. De la Inscrie-te pagina, completați detaliile și faceți clic pe Inscrie-te. Verificați consola de browser și ar trebui să aveți următorul mesaj:

"html": "Toate domeniile sunt bune !!„ 

Pasul 5: Apelați procedura stocată MySQL 

Odată ce avem Nume, adresa de email și parola, putem numi pur și simplu procedura MySQL stocată pentru a crea noul utilizator.

Pentru a vă conecta cu MySQL, vom folosi Flask-MySQL, care este o extensie Flask. Pentru a începe cu Flask-MySQL, instalați-l utilizând țâfnă manager de pachete:

pip instalați balonul-mysql

Importați MySQL înăuntru app.py:

de la importul flask.ext.mysql MySQL

Anterior am definit aplicația după cum se arată:

app = Flask (__ name__)

Împreună cu acestea includ următoarele configurații MySQL:

mysql = configurații MySQL app.config ['MYSQL_DATABASE_USER'] = 'jay' app.config ['MYSQL_DATABASE_PASSWORD'] = 'jay' app.config ['MYSQL_DATABASE_DB'] = 'BucketList' app.config ['MYSQL_DATABASE_HOST '] =' localhost 'mysql.init_app (app) 

Mai întâi, să creăm conexiunea MySQL:

conn = mysql.connect ()

Odată ce conexiunea este creată, vom avea nevoie de a cursor pentru a interoga procedurile stocate. Deci, folosind Conn conectați, creați un cursor.

cursor = conn.cursor ()

Înainte de a apela procedura de creare a unui utilizator stocat, să facem parola salată folosind un ajutor oferit de Werkzeug. Importați modulul în app.py:

de la werkzeug import generate_password_hash, check_password_hash

Utilizați modulul de sărare pentru a crea parola de tip hashed.

_hashed_password = generate_password_hash (_password)

Acum, să chemăm procedura sp_createUser:

cursor.callproc ( 'sp_createUser', (_ numele, _email, _hashed_password))

Dacă procedura este executată cu succes, atunci vom proceda la schimbările și vom returna mesajul de succes. 

date = cursor.fetchall () dacă len (date) este 0: conn.commit () retur json.dumps ('message': 'User created successfully! str (date [0]))

Salvați modificările și reporniți serverul. Accesați pagina de înscriere și introduceți Nume, adresa de email și parola și faceți clic pe Inscrie-te buton. La crearea cu succes a utilizatorului, veți putea vedea un mesaj în consola browserului dvs..

"message": "Utilizatorul a fost creat cu succes!"

Înfășurați-o

În acest tutorial, am văzut cum să începeți cu crearea unei aplicații web utilizând Python Flask, MySQL si Flask-MySQL extensie. Am creat și proiectat tabelele bazei de date și procedura stocată și am implementat funcționalitatea de înscriere. În următorul tutorial, vom lua această serie la nivelul următor prin implementarea funcționalității de conectare și a altor funcții.

Codul sursă din acest tutorial este disponibil pe GitHub.

Spuneți-ne gândurile dvs. în comentariile de mai jos! 

Aflați Python

Aflați Python cu ghidul nostru complet de instrucțiuni Python, indiferent dacă sunteți doar începători sau sunteți un coder experimentat în căutarea unor noi abilități.