Codeเส้นทางจุดประกาย: URL การกำหนดเส้นทางพร้อมตัวอย่าง

สิ่งที่เป็น Codeเส้นทางจุดประกายไฟ?

เส้นทางต่างๆ มีหน้าที่รับผิดชอบในการตอบสนองต่อ URL คำขอ การกำหนดเส้นทางตรงกับ URL ไปยังเส้นทางที่กำหนดไว้ล่วงหน้า หากไม่พบเส้นทางที่ตรงกัน CodeIgniter แสดงข้อผิดพลาด "ไม่พบหน้าเว็บ"

เส้นทางใน Codeตัวจุดประกายไฟถูกกำหนดโดยใช้สูตรด้านล่างนี้:

example.com/Controller/Method/Parameter/

ที่นี่:

• ตัวควบคุมจะถูกแมปกับชื่อตัวควบคุมที่ควรตอบสนองต่อ URL.
• เมธอดนี้จะถูกแมปไปยังเมธอดในคอนโทรลเลอร์ที่ควรตอบสนองต่อคำขอ URI
• พารามิเตอร์ – ส่วนนี้เป็นทางเลือก

Codeตัวอย่างเส้นทางการจุดประกาย

ต่อไปเรามาดูตัวอย่างที่เป็นรูปธรรมกัน URL การกำหนดเส้นทางใน Codeเครื่องทำให้ลุกไหม้ ตัวอย่างเช่น พิจารณาสิ่งต่อไปนี้ URL: http://localhost:3000/contacts/edit/1

ที่นี่:

• ชื่อของตัวควบคุมที่ตอบสนองต่อข้อความข้างต้น URL คือ “รายชื่อผู้ติดต่อ”
• เมธอดในคลาสคอนโทรลเลอร์ Contacts คือ “edit”
• เมธอด edit รับพารามิเตอร์หนึ่งตัว ในตัวอย่างของเรา ค่า "1" ถูกส่งไปยังเมธอดนี้

ต่อไปนี้เป็นข้อมูลโดยย่อเกี่ยวกับสิ่งที่เราวางแผนจะทำ:

• การกำหนดเส้นทาง – การกำหนดเส้นทางตอบสนองต่อ URL การร้องขอ Codeการกำหนดเส้นทางของ Igniter ตรงกับ URL ไปยังเส้นทางที่กำหนดไว้ล่วงหน้า หากไม่พบเส้นทางที่ตรงกัน CodeIgniter แสดงข้อผิดพลาด "ไม่พบหน้าเว็บ"
• ตัวควบคุม – เส้นทางต่างๆ เชื่อมโยงกับตัวควบคุม ตัวควบคุมทำหน้าที่เชื่อมต่อโมเดลและวิวเข้าด้วยกัน โดยจะร้องขอข้อมูลและตรรกะทางธุรกิจจากโมเดล และส่งผลลัพธ์กลับมาผ่านการแสดงผลของวิว เมื่อ... URL เมื่อตรงกับเส้นทางแล้ว ระบบจะส่งต่อไปยังฟังก์ชันสาธารณะของคอนโทรลเลอร์ ซึ่งจะโต้ตอบกับแหล่งข้อมูลและตรรกะทางธุรกิจ และส่งคืนมุมมอง
• เข้าชม – มุมมองมีหน้าที่นำเสนอ มุมมองมักจะเป็นการผสมผสานระหว่าง HTML, CSS และ Javaต้นฉบับส่วนนี้มีหน้าที่แสดงหน้าเว็บให้ผู้ใช้เห็น โดยทั่วไปแล้ว ข้อมูลที่แสดงจะถูกดึงมาจากฐานข้อมูลหรือแหล่งข้อมูลอื่น

เพื่อเรียนรู้วิธีการกำหนดเส้นทางในโครงการจริง เราจะสมมติว่าเรากำลังสร้างแอปพลิเคชันสำหรับจัดการรายละเอียดการติดต่อ ตารางต่อไปนี้แสดง... URLพวกเราจะทำงานร่วมกับพวกเขา

เราจะสร้างเส้นทางของแอปพลิเคชันของเราโดยอิงจากตารางด้านบน เราได้กำหนดไว้แล้ว URLs, Codeกำหนดเส้นทาง Igniter และแมปเส้นทางเหล่านั้นไปยังชื่อคอนโทรลเลอร์และเมธอดที่เกี่ยวข้อง

การสร้าง URL การกำหนดเส้นทางสำหรับแอปพลิเคชัน

มาสร้างสรรค์กันเถอะ Codeเครื่องทำให้ลุกไหม้ URL การกำหนดเส้นทางสำหรับโปรเจ็กต์ตัวอย่างของเรา เปิดไฟล์ application/config/routes.php และแก้ไขเส้นทางให้ตรงกับตัวอย่างต่อไปนี้:

$route['default_controller'] = 'welcome';
$route['contacts'] = 'contacts';
$route['create'] = 'contacts/create';
$route['edit/:id'] = 'contacts/edit';
$route['update/:id'] = 'contacts/update';
$route['delete/:id'] = 'contacts/delete';
$route['404_override'] = '';
$route['translate_uri_dashes'] = FALSE;

ที่นี่:

• $route['default_controller'] = 'ยินดีต้อนรับ'; กำหนดคอนโทรลเลอร์เริ่มต้นยินดีต้อนรับ
• $route['contacts'] = 'contacts'; กำหนดเส้นทางรายชื่อผู้ติดต่อที่เรียกใช้เมธอด index ในคอนโทรลเลอร์รายชื่อผู้ติดต่อ
• $route['create'] = 'contacts/create'; กำหนดเส้นทางสร้าง (create) ที่ชี้ไปยังคอนโทรลเลอร์ Contacts และเรียกใช้เมธอด create
• $route['edit/:id'] = 'contacts/edit'; กำหนดเส้นทาง edit ที่รับพารามิเตอร์ id และชี้ไปยังเมธอด edit ของคอนโทรลเลอร์ Contacts
• $route['update/:id'] = 'contacts/update'; กำหนดเส้นทางอัปเดตที่รับพารามิเตอร์ id และชี้ไปยังเมธอด update ของคลาส Contacts
• $route['delete/:id'] = 'contacts/delete'; กำหนดเส้นทางลบข้อมูลที่รับพารามิเตอร์ id และชี้ไปยังเมธอด delete ของคอนโทรลเลอร์ Contacts

ตารางต่อไปนี้แสดงรายละเอียดที่เกี่ยวข้อง URLs ที่ได้มาจากเส้นทางที่กำหนดไว้ข้างต้น:

เมื่อเราได้เรียนรู้เกี่ยวกับเส้นทางต่างๆ แล้ว ต่อไปเราจะสร้างคอนโทรลเลอร์ Contacts ที่จะตอบสนองต่อการกระทำที่ระบุไว้ในเส้นทางเหล่านั้น สร้างไฟล์ใหม่ชื่อ Contacts.php ใน application/controllers/Contacts.php และเพิ่มโค้ดต่อไปนี้:

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

class Contacts extends CI_Controller {

public function __construct() {
parent::__construct();
$this->load->helper('url');
}

public function index() {
$this->load->view('header');
$this->load->view('contacts/index');
$this->load->view('footer');
}

public function create() {
$this->load->view('header');
$this->load->view('contacts/create');
$this->load->view('footer');
}

public function edit($id) {
$this->load->view('header');
$this->load->view('contacts/edit');
$this->load->view('footer');
}

public function update($id) {
$this->load->view('header');
$this->load->view('contacts/update');
$this->load->view('footer');
}

public function delete($id) {
$this->load->view('header');
$this->load->view('contacts/delete');
$this->load->view('footer');
}
}

ที่นี่:

• คลาส Contacts extends CI_Controller {…} กำหนดคลาสคอนโทรลเลอร์ของเราและสืบทอดมาจากคลาส CI_Controller ที่มาพร้อมกับ Codeตัวจุดไฟ
• เมธอดที่กำหนดไว้ข้างต้นสอดคล้องกับเส้นทางที่เรากำหนดไว้ และเมธอดที่มีพารามิเตอร์ เช่น delete จะรับพารามิเตอร์ $id
• โปรดสังเกตว่าฟังก์ชันต่างๆ จะโหลดมุมมองสามแบบ ส่วนหัวและส่วนท้ายเป็นส่วนที่ใช้ร่วมกันสำหรับทุกเมธอด ส่วนมุมมองตรงกลางจะเป็นส่วนเฉพาะสำหรับแต่ละการกระทำ เช่น ลบสำหรับฟังก์ชันลบ และสร้างสำหรับฟังก์ชันสร้าง อีกสิ่งสำคัญที่ควรจำไว้คือ มุมมองเหล่านี้จะถูกโหลดจากไดเร็กทอรีย่อยของรายชื่อติดต่อ

Codeมุมมองผู้จุดประกาย

เรายังต้องดำเนินการอีกขั้นตอนหนึ่งก่อนที่จะสามารถทดสอบได้ Codeการกำหนดเส้นทาง Igniter พร้อมพารามิเตอร์ในเว็บเบราว์เซอร์ มาสร้างวิวที่สอดคล้องกับเมธอดคอนโทรลเลอร์ข้างต้นกัน ภาพต่อไปนี้แสดงให้เห็นว่าแอปพลิเคชันจะมีลักษณะอย่างไร:

สร้างไฟล์ต่อไปนี้ในโฟลเดอร์ application/views:

header.php – this file will contain the contacts app menu and the header
footer.php – this file will contain the application footer

สร้างไดเร็กทอรีใหม่ชื่อ contacts ภายใน application/views (application/views/contacts) และสร้างไฟล์ต่อไปนี้ไว้ภายในไดเร็กทอรีนั้น:

index.php
create.php
edit.php

โครงสร้างไฟล์ของคุณควรเป็นดังนี้:

ตอนนี้เรามาอัปเดตไฟล์ header.php กันเถอะ:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>CodeIgniter Routes</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">CI Contacts v1</h1>
<h2 class="subtitle">CodeIgniter contacts management app</h2>
<div class="columns">
<div class="column is-one-quarter">
<aside class="menu">
<p class="menu-label">
General
</p>
<ul class="menu-list">
<li><a class="is-active" href="#">Dashboard</a></li>
<li><a href="<?=site_url('contacts/create')?>">New Contact</a></li>
<li><a href="<?=site_url('contacts/edit/1')?>">Edit Contacts</a></li>
</ul>
<p class="menu-label">
Settings
</p>
<ul class="menu-list">
<li><a href="#">SMS</a></li>
<li><a href="#">Email</a></li>
</ul>
</aside>
</div>

ที่นี่:

• โค้ด HTML ด้านบนจะโหลด Bulma CSS จาก CDN

ต่อไปนี้คือโค้ดสำหรับไฟล์ footer.php:

</div>
</div>
</section>
</body>
</html>

ต่อไปนี้เราจะเพิ่มโค้ดสำหรับไฟล์ index.php, edit.php และ create.php สำหรับรายชื่อผู้ติดต่อ:

index.php
<div class="column">Index content goes here...</div>
edit.php
<div class="column">Edit content goes here...</div>
create.php
<div class="column">Create content goes here...</div>

คุณสามารถบันทึกการเปลี่ยนแปลงทั้งหมดที่ทำไว้ได้ เปิดไฟล์ต่อไปนี้ URL ในเว็บเบราว์เซอร์ของคุณ: http://localhost:3000/contacts/คุณสามารถคลิกที่ลิงก์ "เพิ่มผู้ติดต่อใหม่" และ "แก้ไขผู้ติดต่อ" เพื่อดูว่าจะเกิดอะไรขึ้น

คำถามที่พบบ่อย