Share
Questo tutorial è un'introduzione al modello Hierarchical Model View Controller (HMVC) e come si applica allo sviluppo di applicazioni Web. Per questo tutorial, userò degli esempi forniti dalla serie CodeIgniter di Scratch e dimostreremo come HMVC può essere una valida modifica al tuo processo di sviluppo. Questa introduzione presuppone una comprensione del modello Model View Controller (MVC). Ti consigliamo di leggere la nostra introduzione a MVC per familiarizzare con l'argomento prima di affrontare questo tutorial.
HMVC è un'evoluzione del pattern MVC utilizzato per la maggior parte delle applicazioni Web oggi. Si trattava di una risposta ai problemi di salinità apparenti nelle applicazioni che utilizzavano MVC. La soluzione presentata nel sito web JavaWorld, nel luglio 2000, ha proposto che la triade standard di Model, View e Controller diventasse stratificata in un "gerarchia dei livelli MCV padre-figlio"L'immagine seguente illustra come funziona:
Ogni triade funziona indipendentemente l'una dall'altra. Una triade può richiedere l'accesso a un'altra triade tramite i loro controllori. Entrambi questi punti consentono all'applicazione di essere distribuita su più posizioni, se necessario. Inoltre, la stratificazione delle triadi MVC consente uno sviluppo di applicazioni più approfondito e robusto. Questo porta a diversi vantaggi che ci portano al nostro prossimo punto.
Principali vantaggi per l'implementazione del modello HMVC nel ciclo di sviluppo:
Questi vantaggi ti permetteranno di estrarre M.O.R.E dalla tua applicazione con meno mal di testa.
Per aggiungere ulteriore profondità alla serie CodeIgniter di Scratch, vedremo gli esempi di oggi in CodeIgniter. Ci guiderò attraverso i passaggi necessari per far funzionare CodeIgniter con HMVC. Una volta che abbiamo finito, fornirò un paio di esempi. Cominciamo!
Per eseguire applicazioni Web, è necessario un server Web sul computer se non si sta lavorando in remoto. Ecco i consigli con collegamenti alle istruzioni di installazione:
Vai su codeigniter.com e clicca sul link "Download CodeIgniter". Se sai come installarlo e vuoi saltare questo passaggio clicca qui
Estrai il contenuto del file zip nella root dei documenti del tuo server web.
Rinominare il "CodeIgniter_1.7.2"cartella in"hmvcExample".
Muovi il "hmvcExample / system / application"cartella in"hmvcExample / applicazione"Questa è una pratica comune con CodeIgniter. Lo scopo di questo è di separare l'applicazione dal core del framework. Dovremmo ora avere una directory che assomigli all'immagine qui sotto:
Aperto "hmvcExample / application / config / config.php"nel tuo editor di scelta.
Modifica l'url della base del sito in modo che corrisponda alla posizione della tua installazione. Nel mio caso, cambierei
$ config ['base_url'] = "http://example.com/";
in
$ config ['base_url'] = "http: // localhost / hmvcExample /";
Salva le tue modifiche e chiudi "hmvcExample / application / config / config.php"
Prova che abbiamo una versione funzionante di CodeIgniter. Apri il browser e controlla "http: // tuohost / hmvcEsempio /".
Dovresti essere accolto con la schermata "Welcome to CodeIgniter" di seguito:
Questo è tutto! Hai scaricato e installato con successo CodeIgniter. Ora passeremo a farlo funzionare con l'estensione HMVC.
Scarica la versione 5.2 dell'estensione modulare da CodeIgniter Wiki.
Nei contenuti del file zip ci sono tre file php:
Sposta questi tre file nella "hmvcExample / application / librerie /" cartella.
Ricontrolla il tuo browser Dovresti comunque vedere la schermata Welcome to CodeIgniter.
È ora di aggiungere i moduli. Crea la seguente struttura di directory "application / modules / welcome / controller /".
Muovi il "application / controller / welcome.php" a "application / modules / welcome / controller / welcome.php".
Ricontrolla il tuo browser Dovresti comunque vedere la schermata Welcome to CodeIgniter.
Crea la cartella "application / modules / welcome / views /"
Muovi il "application / views / welcome_message.php" a "application / modules / welcome / views / welcome_message.php".
Fai un controllo finale sul tuo browser. Dovresti comunque vedere la schermata Welcome to CodeIgniter.
Questo è tutto! Modular Extensions è installato correttamente.
Ora che abbiamo la nostra istanza di CodeIgniter abilitata per HMVC, mostrerò alcuni brevi esempi. Per il nostro primo esempio mostrerò come è possibile applicare restrizioni di accesso utente a pagine o interi moduli.
Scarica e decomprimi CodeIgniter da Scratch Day 6 file sorgente nel tuo server web. Dovresti finire con una cartella chiamata "ci_day6 /"accanto al nostro"hmvcExample /"
Crea il "accesso"modulo nel nostro"hmvcExample / applicazione"directory. Dovrebbe finire così
hmvcEsempio / applicazione / moduli / login / controller / hmvcEsempio / applicazione / moduli / login / modelli / hmvcEsempio / applicazione / moduli / login / visualizzazioni /
Crea il modulo "sito" nella nostra directory "hmvcExample / application". Dovrebbe finire così
hmvcEsempio / applicazione / moduli / sito / controllori / hmvcEsempio / applicazione / moduli / sito / modelli / hmvcEsempio / applicazione / moduli / sito / viste /
MANCIA: Quando lavoro con i moduli tengo una cartella chiamata RENAME con i tre controller di cartelle vuote, i modelli e le viste. Questo mi consente di risparmiare un po 'di tempo ogni volta che desidero creare un nuovo modello.
Ora copiamo il file accesso file modulo da "ci_day6 /" a noi "hmvcExample /".
ci_day6 / application / controller / login.php ci_day6 / application / models / membership_model.php ci_day6 / application / views / login_form.php ci_day6 / application / views / signup_form.php ci_day6 / application / views / signup_successful.php
Copia / sposta ciascuno dei file sopra elencati come indicato di seguito
hmvcEsempio / applicazione / moduli / login / controller / login.php hmvcEsempio / applicazione / moduli / login / modelli / membership_model.php hmvcEsempio / applicazione / moduli / login / visualizzazioni / login_form.php hmvcEsempio / applicazione / moduli / login / visualizzazioni / signup_form .php hmvcExample / application / modules / login / views / signup_successful.php
Successivamente copiamo il file posto file modulo da "ci_day6 /" a noi "hmvcExample /".
ci_day6 / application / controller / site.php ci_day6 / application / views / logged_in_area.php
Copia / sposta ciascuno dei file sopra elencati come indicato di seguito
hmvcEsempio / applicazione / moduli / sito / controllori / sito.php hmvcEsempio / applicazione / moduli / sito / viste / logged_in_area.php
Gli ultimi file da copiare sono le viste globali e i file CSS e di immagine. L'asterisco (*) denota la cartella e tutti i suoi contenuti comprese le sottocartelle
ci_day6 / css / * ci_day6 / img / * ci_day6 / application / views / includes / *
Copia ciascuna delle suddette cartelle e tutti i loro contenuti come elencato di seguito
hmvcEsempio / css / * hmvcEsempio / img / * hmvcEsempio / applicazione / viste / include / *
Aperto "hmvcExample / application / config / autoload.php"e modificalo per assomigliare a questo:
Accentsconagua
$ autoload ['libraries'] = array ('database', 'sessione'); // È necessario il caricamento automatico del DB e della sessione / * | -------------------------------------------------- ----------------- | Caricamento automatico dei file di supporto | -------------------------------------------------- ----------------- | Prototipo: | | $ autoload ['helper'] = array ('url', 'file'); * / $ autoload ['helper'] = array ('url', 'form'); // È necessario caricare automaticamente l'URL e il modulo. Se non lo hai già fatto dal primo passaggio, apri "hmvcExample / application / config / config.php"e modificarlo in modo che l'URL di base sia impostato nella posizione appropriata.
$ config ['base_url'] = "http: // localhost / hmvcExample /"; // indirizzo Web. AVVERTENZA continuare a trascinare /
Aperto "hmvcExample / application / config / database.php"e aggiungi i collegamenti appropriati al tuo database.
$ db ['default'] ['hostname'] = "localhost"; // posizione del server DB $ db ['default'] ['username'] = "IL TUO NOME UTENTE QUI"; // nome utente che usi per connettere $ db ['default'] ['password'] = "LA TUA PASSWORD QUI"; // password associata $ db ['default'] ['database'] = "ci_series"; // Il database che si desidera utilizzare
Apri il browser per verificare che venga visualizzata la pagina di accesso "http: //localhost/hmvcExample/index.php/login"
Ora per fare questa funzione di login, dobbiamo creare la tabella del database di appartenenza. Per questo, abbiamo bisogno di creare una tabella nel tuo PHPMyAdmin.
Seleziona o crea il tuo "ci_series" Banca dati.
Nella scheda sQL, incolla il codice qui sotto nella textarea e fai clic su Vai
CREATE TABLE 'ci_series'. 'Membership' ('id' INT (11) NOT NULL AUTO_INCREMENT CHIAVE PRIMARIA, 'first_name' VARCHAR (32) NOT NULL, 'last_name' VARCHAR (32) NOT NULL, 'email_address' VARCHAR (64) NOT NULL, 'username' VARCHAR (32) NOT NULL, 'password' VARCHAR (32) NOT NULL) ENGINE = MYISAM; 
Con la tabella di appartenenza creata, clicchiamo su Creare un profilo link sul pagina di login e aggiungere un utente al database.
Accedi come utente e conferma di essere ora nel "sito / members_area"del sito. Dovrebbe apparire simile all'immagine qui sotto:
Fai clic sul link "disconnessione" e prova a tornare manualmente all'area membri. vedrai che non hai più il permesso di farlo.
Quindi abbiamo raggruppato le nostre triadi, ma non siamo ancora abbastanza in modalità HMVC. Nel controller del sito troviamo una funzione chiamata is_logged_in ().
function is_logged_in () $ is_logged_in = $ this-> session-> userdata ('is_logged_in'); if (! isset ($ is_logged_in) || $ is_logged_in! = true) echo 'Non hai il permesso di accedere a questa pagina. Accesso'; morire(); Questa è una funzione relativa al login. In modalità MVC, è necessario perché il sito non può accedere al login. Con HMVC possiamo risolvere questo problema.
Taglia la funzione is_logged_in () di "Applicazioni / modules / site / controller / site.php"
Salva site.php senza la funzione is_logged_in ().
Aperto "Applicazioni / modules / login / controller / login.php".
Incolla la funzione is_logged_in () nella classe.
Salva login.php
Aperto "Applicazioni / modules / site / controller / site.php".
function __construct () parent :: Controller (); $ This-> is_logged_in ();
Nella funzione __Construct (), facciamo la chiamata HMVC alla funzione is_logged_in () di login, come mostrato di seguito:
function __construct () parent :: Controller (); // Format: modules :: run ('module / controller / action', $ param1, $ param2, ..., $ paramN); I moduli :: run ( 'login / is_logged_in'); Ecco qua! Abbiamo modificato con successo il codice del giorno sei in formato HMVC. Il modulo del sito ora richiede il controllo dell'accesso invece di dover utilizzare il proprio. Mentre esternamente non osserviamo alcuna differenza, il design del sito è stato radicalmente cambiato. Tutte le funzioni di login sono ora dove appartengono: all'interno della triade di login. Questo può sembrare un sacco di lavoro con una piccola ricompensa, ma non è così. Eventuali modifiche all'accesso possono essere apportate una sola volta. La struttura interna della triade può essere modificata senza dover modificare l'intera applicazione in risposta. La replica del codice per altri controller non è più necessaria. Ultimo ma non meno importante, tutto il codice relativo è in una posizione a portata di mano. Questo piccolo passaggio potrebbe non WOW, ma quando approfondiremo le applicazioni più complesse e complesse, il M.O.R.E. apparente diventerà quanto è efficace il modello HMVC.
Ora scopriremo altro del potere di HMVC. Abbiamo appena dimostrato come chiamare un modulo da un controller. Ci sono altri posti in cui puoi farlo anche tu. HMVC è stato creato pensando all'interfaccia utente (UI). Come risultato, riceviamo moduli dai nostri punti di vista. È qui che la potenza di HMVC può davvero brillare.
Quando chiami HMVC da una vista utilizzerai gli stessi moduli :: run (). C'è solo un requisito quando si fa questo. L'output risultante dalla chiamata dovere essere uno snippet html e non una vista completa. Questo perché siamo già all'interno di una vista nel momento in cui chiamiamo la funzione di esecuzione. Vedremo questo in azione lungo la pagina mentre modifichiamo le viste del modulo del sito.
Creeremo un blocco che appare in cima a ogni pagina con il nome del nostro utente, collegamenti importanti e l'opzione di disconnessione. Oggigiorno widget come questo sono comuni nei siti. L'immagine sotto illustra il risultato finale.
Aperto "Applicazioni / modules / login / controller / login.php".
function cp () if ($ this-> session-> userdata ('username')) // carica il modello per questo controller $ this-> load-> model ('membership_model'); // Ottieni dettagli utente dal database $ utente = $ this-> membership_model-> get_member_details (); if (! $ user) // Nessun utente trovato restituisce falso; else // visualizza il nostro widget $ this-> load-> view ('user_widget', $ user); else // Non c'è alcuna sessione, quindi non restituiamo nulla return false; Incolla / scrivi il codice sopra nel controller di accesso.
cp () riceve informazioni dalla funzione membership_model, get_member_details (), che creiamo nel passaggio successivo. Se viene trovato un utente, verrà visualizzato lo snippet di visualizzazione dettagliato nel passaggio tre. Da lì dovremmo ottenere il blocco desiderato illustrato sopra.
Salva le modifiche apportate a login.php
Noterai che abbiamo chiamato get_member_details () da membership_model. Questa funzione ottiene le informazioni dell'utente dal database e sarà accessibile da diverse fonti. Ci lavoreremo su ora.
Aperto "Applicazioni / modules / login / modelli / membership_model.php".
function get_member_details ($ id = false) if (! $ id) // Imposta il record attivo dove inserire il nome utente della sessione corrente se ($ this-> session-> userdata ('username')) $ this-> db- > where ('username', $ this-> session-> userdata ('username')); else // Restituisce una persona non registrata dall'accesso al dashboard del profilo membro return false; else // ottiene l'utente da id $ this-> db-> where ('id', $ id); // Trova tutti i record che corrispondono a questa query $ query = $ this-> db-> get ('membership'); // In questo caso, poiché non disponiamo di un set di controllo per un nome utente univoco, verrà restituito l'ultimo utente creato con il nome utente selezionato. if ($ query-> num_rows ()> 0) // Ottieni l'ultima riga se ci sono più di una riga $ = $ query-> last_row (); // Assegna la riga al nostro array di restituzione $ data ['id'] = $ row-> id; $ data ['first_name'] = $ row-> first_name; $ data ['last_name'] = $ row-> last_name; // Restituisce l'utente restituito $ dati; else // Nessun risultato trovato return false; Commenta il tuo codice! È una buona pratica e aiuterà gli altri a capire ciò che hai scritto.
Linea 01: La chiamata di funzione ha una variabile di default $ id. Questo ci consente di trovare un utente per ID anziché per nome utente. Ciò reso opzionale impostandolo su false nella dichiarazione.
Il resto della funzione è semplice e ben commentato. Esaminiamo la tabella di appartenenza per un utente tramite nome utente o ID. Il risultato viene salvato nell'array $ data e restituito. Tutti gli altri risultati restituiscono false.
Salva le modifiche apportate a membership_model.php
Il terzo e ultimo pezzo del widget che stiamo creando è lo snippet xhtml, che possiamo inserire in qualsiasi altra vista. Questo è chiamato dalla funzione cp () del controller di accesso che abbiamo appena scritto.
Aperto "Applicazioni / modules / login / views / user_widget.php".
· | | | Nota: Non è una buona pratica usare lo stile in linea. Ho scelto di mettere questa istanza di stile in linea per rimanere sul tema.
Questo blocco di codice disegnato prende le informazioni passate dalla funzione cp (). Generiamo i collegamenti usando la funzione anchor () dell'helper di CodeIgniter. Ulteriori informazioni sulla guida dell'utente sono disponibili su codeigniter.com.
Dopo aver lavorato su questi tre file, testeremo il "Login / cp"pagina. Dovremmo vedere qualcosa come l'immagine qui sotto. Nota: Devi essere loggato int per vederlo. Assicurati di farlo prima di controllare la pagina o non vedrai nulla.
I link nello snippet al profilo e ai messaggi restituiscono un errore per il momento. Questo è ok perché non abbiamo ancora creato quelle funzioni. Lo faccia adesso.
Aperto "Applicazioni / modules / site / controller / site.php".
load-> view ( 'logged_in_area');
__costruire()
Ai fini di questo esempio, rimuoveremo il ...
I moduli :: run ( 'login / is_logged_in');
... dalla funzione in modo che possiamo rendere le parti specifiche private e avere altre parti pubbliche.
zona membri()
Vogliamo solo gli utenti registrati per accedere all'area dashboard dei membri. Quindi utilizzeremo i moduli: esegui la funzione HMVC e richiama il controllo is_logged_in dal controller di login. Carichiamo quindi il file di visualizzazione loggato_area che verrà modificato più avanti nella pagina.
function messages () modules :: run ('login / is_logged_in'); $ This-> load-> modello ( 'login / membership_model'); $ user = $ this-> membership_model-> get_member_details ($ this-> uri-> segment (3)); if (! $ user) // Nessun utente trovato restituisce falso; else // visualizza il nostro widget $ this-> load-> view ('member_messages', $ user); messaggi ()
Come membri_area (), vogliamo solo gli utenti registrati, quindi abbiamo incluso il controllo is_logged_in. Abbiamo già scritto il codice su come ottenere i dettagli dell'utente dal database, in modo da caricare il modello di login, membership_model. Questo ci consentirà di ottenere le informazioni dell'utente tramite la funzione get_member_details (). Il terzo segmento URI che viene passato in quella funzione è un id per l'utente per il quale vogliamo ricevere i messaggi. Ad esempio, se l'URL era:
http: //localhost/hmvcExample/index.php/site/messages/43
Quindi la nostra funzione get_member_details () riceverebbe "43" come variabile di input. A seconda del risultato di get_member_details (), viene mostrata la vista: member_messages o non otteniamo nulla (come risultato di una query fallita).
function profile () $ this-> load-> model ('login / membership_model'); $ user = $ this-> membership_model-> get_member_details ($ this-> uri-> segment (3)); if (! $ user) // Nessun utente ha trovato $ data ['main_content'] = 'member_profile'; $ data ['notice'] = 'è necessario visualizzare un ID profilo'; $ this-> load-> view ('include / template', $ data); else // visualizza il nostro widget $ utente ['main_content'] = 'member_profile'; $ this-> load-> view ('include / template', $ user); profilo()
Proprio come qualsiasi social network; vogliamo che le pagine del profilo siano pubbliche. Quindi non abbiamo incluso il controllo is_logged_in. Proprio come i messaggi, chiamiamo la membership triad's membership_model e interrogiamo il database per l'utente desiderato. In questo caso, se non viene trovato nessun utente, chiudiamo un po 'più elegantemente. Informiamo anche il visitatore che è necessario specificare un ID. Con un risultato positivo, vediamo il profilo del membro.
Aperto "Applicazioni / modules / site / views / logged_in_area.php".
Senza titolo Ben tornato, session-> userdata ( 'username'); ?>!
Questa sezione rappresenta l'area a cui possono accedere solo i membri registrati.
Sovrascrivi il contenuto del file con il codice sopra.
Linea 08: HMVC è messo in azione qui. La nostra visione chiama "Login / cp"funzione, e fa eco allo snippet html esattamente dove lo diciamo.Nota come non abbiamo dovuto preparare nulla da soli?" Tutto è gestito internamente dal login per noi. Handy non è?
Salva le modifiche apportate a logged_in_area.php. La tua pagina finita dovrebbe essere visualizzata come:
Crea una nuova vista: "Applicazioni / modules / site / views / member_messages.php".
Senza titolo I messaggi
Questo potrebbe essere il luogo in cui viene visualizzato il sistema di messaggistica
Scrivi o incolla il codice sopra nel file appena creato.
Questa vista è praticamente solo un clone dell'area membri per verificare che il login resti su più pagine. C'è una differenza: abbiamo raccolto alcune informazioni dal membership_model del modulo di login. Questo è mostrato come la variabile $ first_name.
Il punto di ottenere informazioni utente qui sarebbe di passare a un modulo che restituirebbe uno snippet con i messaggi dell'utente.
Salva le modifiche apportate a member_messages.php. La tua pagina finita dovrebbe essere visualizzata come:
Crea una nuova vista: "Applicazioni / modules / site / views / member_profile.php".
Pagine del profilo dei membri
Profilo di
Metti qui tutte le informazioni sul buon profilo sano!
Scrivi o incolla il codice sopra nel file appena creato.
Abbiamo un'istruzione if che rileva se un utente è stato trovato o meno. In caso contrario, verremo reindirizzati a una pagina di errore in cui viene indicato che è necessario un ID per visualizzare un profilo.
Di nuovo, recuperiamo le informazioni dell'utente. Proprio come i messaggi, useremmo questo per recuperare l'elenco di amici dell'utente, l'ultimo post di blog e il feed di attività, ecc.
Salva le modifiche apportate a member_profile.php. La tua pagina finita dovrebbe essere visualizzata come:
Perché vogliamo che le pagine del profilo siano pubbliche, dovrebbe comunque essere visualizzato. Meno il widget utente, ovviamente.
Una volta effettuato l'accesso, e andiamo al profilo senza un terzo segmento uri, vediamo il nostro profilo. Disconnesso, verrà mostrato l'errore qui sotto.
Non dovremmo essere in grado di visualizzare il messaggio o il dashboard. Quando controlliamo la pagina dei messaggi, siamo salutati con questo:
Questo è tutto! Abbiamo aggiunto più profondità al nostro esempio iniziale e dimostrato i diversi modi di utilizzare HMVC.
Spero che questa sia stata un'esperienza illuminante. HMVC è uno schema straordinario che rende le applicazioni più robuste. Vale la pena investire. Provaci. Ti prometto che non vorrai più tornare su Vanilla MVC!
