CodeGyújtóvezérlők, Nézetek Útválasztás: Tanuljon példaalkalmazással

Ebben az oktatóanyagban a következő témákat fogod megtanulni.

  • útvonalválasztás – az útvonalválasztás felelős a válaszadásért URL kérések. Az útvonalválasztás megegyezik a URL az előre meghatározott útvonalakra. Ha nem található egyező útvonal, akkor CodeAz Igniter hibát jelez, mivel a lap nem található kivétel.
  • Vezérlők – az útvonalak vezérlőkhöz kapcsolódnak. A vezérlők összekapcsolják a modelleket és a nézeteket. Az adatok/üzleti logika lekérése a modelltől, és az eredmények visszaadása a nézet megjelenítésében. Miután egy URL Miután a függvény egy útvonalhoz lett illesztve, továbbításra kerül egy vezérlő nyilvános függvényéhez. Ez a függvény interakcióba lép az adatforrással és az üzleti logikával, és visszaadja az eredményeket megjelenítő nézetet.
  • Nézetek – a nézetek felelősek a bemutatásért. A nézet általában HTML, CSS és JavaForgatókönyv. Ez az a rész, amely felelős a weboldal megjelenítéséért a felhasználó számára. A megjelenített adatok általában az adatbázisból vagy bármely más elérhető adatforrásból származnak.

Hogyan lehet újat létrehozni CodeGyújtó projekt

A Composert használjuk egy új projekt létrehozásához. A PHP beépített szerverét fogom használni, így nem szükséges extra szoftver, mint pl Apache. Ebben az oktatóanyagban a Windows operációs rendszer. Ezért létrehoztunk egy Sites mappát a C meghajtón. Bármilyen könyvtárat használhat, amely megfelel Önnek.

Nyissa meg a parancssort/terminált, és futtassa a következő parancsot

cd C:\Sites

Most létrehozunk egy CodeIgniter projekt a Composer segítségével. Futtassa a következő parancsot.

composer create-project CodeIgniter/framework ci-app

ITT,

  • A fenti parancs létrehoz egy új CodeAz Igniter projekt 3-as verzióját a legújabb stabil kiadással, azaz a 3.1.9-essel kell egy ci-app könyvtárba helyezni.

Amikor a fenti parancs lefutott, a terminálban a következőhöz hasonló eredményeket kell kapnia

Újat csinálni CodeGyújtó projekt

Futtassa a következő parancsot az újonnan létrehozott projektkönyvtár ci-app tallózásához

cd ci-app

Most indítsuk el a PHP beépített webszervert

 php -S localhost:3000

ITT,

  • A fenti parancs elindítja a 3000-es porton futó beépített PHP szervert.

Nyisd meg a webböngészőt, és böngészd át a következőket URL: http://localhost:3000/

A következő oldalt fogod kapni

Újat csinálni CodeGyújtó projekt

Ha látja a fenti oldalt, akkor gratulálunk, sikeresen telepítette CodeGyújtó.

Amint az a fenti weboldalról olvasható, a fent megjelenített oldalt az application/views/welcome_message.php fájlban található nézet jeleníti meg, a felelős vezérlő pedig az application/controllers/Welcome.php fájlban található.

CodeGyújtóútvonal-választás

Egyelőre az alkalmazásunk csak egyetlen URL ami a kezdőlap. Ebben a részben a kezdőlapot fogjuk testre szabni. Létrehozunk néhány újat URLamelyek válaszolni fognak a különböző kérésekre.

Kezdjük a kezdőlap útvonalával

Nyissa meg az útvonalfájlt az alábbi elérési út szerint

application/config/routes.php

Látnia kell a következő tartalmat

$route['default_controller'] = 'welcome';
$route['404_override'] = '';
$route['translate_uri_dashes'] = FALSE;

ITT,

  • $route['default_controller'] = 'üdvözöljük'; meghatározza az URI kérésekre válaszoló alapértelmezett vezérlőt
  • $route['404_override'] = ”; ez az útvonal lehetővé teszi egyéni útvonal meghatározását a 404-es hibákhoz. 404-es hiba akkor fordul elő, ha egy oldal nem található. CodeAz Igniternek van egy alapértelmezett kezelője a hibához, de te is definiálhatsz sajátot, ha szeretnéd.
  • $route['translate_uri_dashes'] = FALSE; ez az opció lehetővé teszi a kötőjelek aláhúzásjellé alakítását. Erről az opcióról akkor fogunk beszélni, amikor az útvonalak működését vizsgáljuk. CodeGyújtó.

Most nézzük meg azt a vezérlő metódust, amely a megnyitáskor látott kezdőlap megjelenítéséért felelős. URL http://localhost:3000/ a webböngészőben.

Nyissa meg a következő fájlt

application/controllers/Welcome.php

Látnia kell a következő kódot

<?php
defined('BASEPATH') OR exit('No direct script access allowed');

class Welcome extends CI_Controller {

	public function index()
	{
		$this->load->view('welcome_message');
	}
}

ITT,

  • Defined ('BASEPATH') VAGY exit('Nincs közvetlen szkripthozzáférés engedélyezve'); véd a vezérlőosztály közvetlen elérése ellen az index.php fájlon keresztül. Ne feledd, az MVC paradigmában minden kérésnek egyetlen belépési pontja van, és például CodeIgniter, az index.php. Ez a kód blokkolja az összes olyan kérést, amely nem az index.php-n keresztül érkezik.
  • osztály Welcome kiterjeszti a CI_Controller {…} osztályt definiál, amely kiterjeszti a CI_Controller szülőosztályt
  • A public function index() egy nyilvános függvényt határoz meg, amely alapértelmezés szerint a kezdőlap megnyitásakor kerül meghívásra
  • $this->load->view('welcome_message'); ez a sor betölti a welcome_message nézetet. A welcome_message fájl az application/views/welcome_message.php könyvtárban található.

Eddig csak azt vizsgáltuk, ami a dobozból kikerül CodeGyújtó, most próbáljunk meg néhány változtatást végrehajtani. Létrehozzuk a kezdőlapunkat, és lecseréljük az alapértelmezett oldalt.

Hozzon létre egy új fájlt az application/views/home.php fájlban

Adja hozzá a következő kódot a home.php fájlhoz

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>Hello CodeIgniter!</title>
        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.2/css/bulma.min.css">
        <script defer src="https://use.fontawesome.com/releases/v5.3.1/js/all.js"></script>
    </head>
    <body>
        <section class="section">
            <div class="container">
                <h1 class="title">
                    CodeIgniter Hello World
                </h1>
            </div>
        </section>
    </body>
</html>

ITT,

A fenti HTML kód betölti a Burma SSS keretrendszert és a CDN hálózatból származó betűtípust, és egy nagyon egyszerű HTML dokumentumot hoz létre. Nagyon egyszerű CSS-szabályt alkalmaz a burmai CSS keretrendszerből.

Nyissa meg a következőt URL a böngésződben: http://localhost:3000/

A következőket kell látnia

CodeGyújtóútvonal-választás

Remek, sikeresen módosítottuk a kezdőlapot. Ha tovább haladunk, határozzuk meg az útvonalunkat. Tegyük fel, hogy az alkalmazásunknak képesnek kell lennie a rólunk oldal megjelenítésére is.

Hozzon létre egy útvonalat

Nyissa meg az application/config.routes.php útvonalfájlt

Adja hozzá a következő útvonalat

$route['about-us'] = 'welcome/about_us';

ITT,

  • Amikor egy látogató meglátogatja a URL /rólunk, utasításokat adunk CodeA gyújtó vezérlőt keresi: Üdvözöljük, és futtassa az about_us metódust.

Hozzon létre egy vezérlőt

Határozzuk meg most a vezérlő módszert rólunk

Nyissa meg az application/controllers/Welcome.php-t

Adja hozzá a következő módszert

public function about_us(){
            $this->load->view('about_us');
        }

ITT,

  • A fenti kód egy about_us függvényt határoz meg, és egy about_us nézetet tölt be.

Nézet létrehozása

Most hozzuk létre azt a nézetet, amelyre a fenti részben hivatkoztunk

Hozzon létre egy új about_us.php fájlt az application/views/about_us.php fájlban

Adja hozzá a következő kódot

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>About CodeIgniter!</title>
        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.2/css/bulma.min.css">
        <script defer src="https://use.fontawesome.com/releases/v5.3.1/js/all.js"></script>
    </head>
    <body>
        <section class="section">
            <div class="container">
                <h1 class="title">
                    About us yap...                
                </h1>
            </div>
        </section>
    </body>
</html>

Indulhatunk, nyisd ki a következőt URL a webböngésződben: http://localhost:3000/index.php/about-us

A következő oldalt fogja látni

Nézet létrehozása itt: CodeGyújtó

Ha látod a fenti oldalt, akkor gratulálunk, sikeresen létrehoztál egy egyszerű alkalmazást a CodeGyújtó.

Összegzésként

Ebben az oktatóanyagban három (3) fő összetevőt vettünk át, amelyek egy CodeIgniter alkalmazás. Megvizsgáltuk az útvonalakat és azok definiálását, a vezérlőket és az útvonalkérésekre válaszoló metódusok létrehozásának módját, valamint egyszerű nézeteket hoztunk létre, amelyeket a felhasználók visszaadnak, amikor erőforrást kérnek.

Foglald össze ezt a bejegyzést a következőképpen: