Εργασία Ενοτήτων 5-6

Σκοπός της εργασίας αυτής είναι να γίνει μια επανάληψη σε σημεία της ύλης που έχουμε δει μέχρι τώρα σε συνδυασμό με όσα διδαχθήκαμε στις δυο τελευταίες ενότητες με τις βάσεις δεδομένων.

Για να υλοποιήσουμε τα ζητούμενα θα βασιστούμε στη λύση της εργασίας της ενότητας 1.

Αφού κατεβάσουμε το συνοδευτικό αρχείο, αρχικά παρατηρούμε τη δομή του miniαυτού site:

images/bg.jpg

images/header-bg.jpg

styles/style1.css

index.html

register.html

Για τις αλλαγές που θα ακολουθήσουν πρέπει να διατηρηθεί η δομή του ανέπαφη.

ΖΗΤΗΜΑ Α

Για να προχωρήσουμε με τα υπόλοιπα ζητήματα πρέπει να στήσουμε τη βάση δεδομένων και να προσθέσουμε όσα αρχεία χρειάζονται για την εφαρμογή.

Α.1 Δημιουργήστε από το phpmyadmin μια νέα βάση δεδομένων με το όνομα «azulmediadb».

Α.2 Προσθέστε έναν πίνακα USERπου θα περιέχει τα εξής πεδία:

• id: primary key, auto increment
• username: varchar(40)
• password: εδώ θα πρέπει να αποφασίσετε εσείς τον τύπο δεδομένων. Ο κωδικός θα πρέπει να μην αποθηκεύεται όπως στέλνεται από το χρήστη αλλά σε μια μορφή που να είναι άχρηστη σε όποιον έχει πρόσβαση στη βάση δεδομένων. Ο αποθηκευμένος κωδικός θα έχει νόημα μόνο για την εφαρμογή. Αναζητήστε στο βιβλίο μεθόδους κρυπτογράφησης του κωδικού (στο κεφάλαιο εισαγωγή στην SQL).
• name: varchar(40)
• lastname: varchar(40)

A.2 Προσθέστε έναν πίνακα STYLE που θα περιέχει τα εξής πεδία:

• id: primary key, auto increment
• color : varchar(30)
• URL: varchar(50)

Α.3 Δημιουργήστε δύο νέα αρχεία cssμε ονόματα style2.css και style3.cssπου θα βασίζονται στο style1.css. Η μόνη διαφορά των τριών αυτών αρχείων θα είναι στο χρώμα του backgroundτους. Εντοπίστε το χρώμα του backgroundστο πρώτο css (είναι μαύρο) και αντικαταστήστε το στα άλλα δύο αρχεία με δυο διαφορετικά χρώματα της επιλογής σας.

Α.4 Εισάγετε από το phpmyadminτρεις εγγραφές στον πίνακα STYLE, που θα αναπαριστούν τα αρχεία που μόλις φτιάξατε. Στο πεδίο colorθα βάλετε το χρώμα του backgroundπου επιλέξατε και στο πεδίο URLτο urlπρος το αντίστοιχο αρχείο. Δώστε προσοχή στο URLπου θα επιλέξετε.

ΖΗΤΗΜΑ Β

Δώστε την επιλογή στο χρήστη να αλλάζει το χρώμα του background σε όλες τις σελίδες του site.

Β.1. Αντικαταστήστε το σύνδεσμο Downloads στο το επάνω μενού όλων των σελίδων με ένα σύνδεσμο με το όνομα «Style», που θα οδηγεί σε μια φόρμα που θα φτιάξετε στο επόμενο βήμα. Προσέξτε το URL που θα εισάγετε.

B.2. Φτιάξτε μια νέα φόρμα style.phpβασιζόμενοι στην register.htmlπου θα περιέχει μόνο ένα inputτύπου selectπου θα εμφανίζει τα διαθέσιμα χρώματα του background. Εκτελέστε ένα ερώτημα στη βάση για να λάβετε τις εγγραφές του πίνακα styles και κατασκευάστε ένα array που θα περιέχει τα ζευγάρια (χρώμα, URL). Οι τιμές του selectθα λαμβάνονται από το array που μολις φτιάξατε. Η φόρμα θα υποβάλλεται στον εαυτό της και το μόνο που θα κάνει είναι να τοποθετεί το URL προς το cssπου επέλεξε ο χρήστης στο session. Κατά συνέπεια κάθε σελίδα θα φορτώνει το cssτης από το session.

B.3 Σε κάθε σελίδα του site, η το URLπρος το cssαρχείο θα πρέπει να ορίζεται δυναμικά από το session. Αν δεν έχει οριστεί τιμή στο sessionθα εμφανίζεται το προεπιλεγμένο στυλ που είναι το μαύρο (style1.css).

ΖΗΤΗΜΑ Γ

Υλοποιήστε το μηχανισμό εγγραφής χρηστών (registration). Ο μηχανισμός αυτός θα αποτελείται από δυο αρχεία: το register.php και το registration.php.

Γ.1 Δημιουργείστε μια φόρμα register.php βασιζόμενοι στην υπάρχουσα register.html. Από τη register.htmlσυγκρατήστε μόνο τα πεδία username, κωδικός, επαλήθευση κωδικού, όνομα και επίθετο. Η φόρμα στη register θα υποβάλλεται στο scriptregistration.php

Γ.2 Στο registration.phpθα ελέγχετε πρώτα εάν τα 2 password είναι ίδια και εφόσον είναι, θα κάνετε έλεγχο στη βάση για το username. Εάν δεν υπάρχει ήδη θα δημιουργείτε μια νέα εγγραφή για τον user με το password. Να εμφανίζετε τα κατάλληλα μηνύματα στις περιπτώσεις επιτυχίας και αποτυχίας εγγραφής.

ΖΗΤΗΜΑ Δ

Υλοποιήστε το μηχανισμό της αυθεντικοποίησης χρησιμοποιώντας sessions. Ο μηχανισμός της αυθεντικοποίησης θα πρέπει να αποτελείται από 2 αρχεία.

• login.php
• authenticate.php

Δ.1 Υλοποιήστε μια φόρμα με ένα username & password στο login.php. Όταν τα κάνετε submit θα πρέπει να στέλνετε τα δεδομένα με method="post" στην authenticate.php

Δ.2 Στην authenticate θα παίρνετε τα δεδομένα, θα συνδέεστε στη βάση και θα κάνετε έλεγχο για το username. Εάν το username υπάρχει θα προχωράτε σε

σύγκριση με το password. Ένα σημαντικό κομμάτι είναι να κωδικοποιείτε το password και να μην είναι απλά text. Συζητείστε στα forums διάφορους τρόπους για να γίνει αυτό και βρείτε τους στο βιβλίο (ή ψαξτε στο internet για πηγές και μοιραστείτε τις με τους υπόλοιπους).Εφόσον το password είναι σωστό δημιουργήστε ένα session για τον χρήστη και στειλτε τον χρήστη στην index αλλιώς στείλτε τον στην login.php.

Δ.3 Σε κάθε σελίδα του siteθα αντικαταστείτε το μήνυμα «Το σλόγκαν της σελίδας...»με το μήνυμα «είσαι συνδεδεμένος ως τάδε», στην περίπτωση που ο χρήστης είναι συνδεδεμένος, ενώ θα διατηρεί το αρχικό μήνυμα στην περίπτωση που δεν είναι.

ΛΟΙΠΑ

Δώστε ιδιαίτερη προσοχή στο πάνω μενού να είναι ίδιο σε όλες τις σελίδες του site. Εξετάστε τρόπους να αποφύγετε το γράψιμό του σε κάθε σελίδα. Επίσης διατηρείστε την ομοιομορφία των σελίδων. Τα scriptsπου δημιουργούνται να ακολουθούν τα stylesπου ορίζονται στα css.

ΠΑΡΑΔΟΤΕΑ

Πακετάρετε όλα τα scripts διατηρώντας τη δομή του site, μαζί με ένα sqlscriptτο οποίο θα εξάγετε από το phpmyadminπου θα περιέχει τα ερωτήματα δημιουργίας των πινάκων και εισαγωγής των όποιων δεδομένων σας. Το όνομα του πακέτου θα είναι τις μορφής erg16_EPONYMO_ONOMA.zipπ.χ. erg16_KOLIAS_VASILIS.zip.

Για αυτήν την εργασία θα έχετε δυο εβδομάδες ενώ θα γίνει αναλυτική συζήτησή της στην πρώτη συνάντησή μας στο ΕΜΠ.