Ora ana isin kanggo nyepetake tautan ing 13, ta? A pamula, lan ora mung pamula, kudu nyoba kanggo nulis Link Tamer dhewe nalika sinau sawetara framework anyar. Kang aku nindakake. Apa sing bisa dakkandhakake - bootstrap kaping lima, kerangka rendah lemak lan sepotong jiwa.
kene demolan kene kode. Kanggo sing maca kaya aku 😉
Kerangka, bener?
Mesthi ora Laravel lan liya-liyane - dina iki kita bakal nggawe 65 kilobyte FatFreeFramework. Yen sampeyan kenal karo Flask Python, sampeyan bakal rumangsa yen iki wis ditindakake ing endi wae:
#роутинг во Фласке
@app.route('/')
def hello_world():
return 'Hello, World!'
Oke, lali. Ngundhuh .zip saka offsite, unpack menyang folder, sing ing wektu sing padha mbukak ing Editor Kode Favorit. Cetha index.php lan mbusak kabeh saka /ui.
Kabeh ing kene gampang banget - ing folder kasebut ui Kita duwe kabeh Tampilan, utawa, kanthi gampang, nganyari template HTML sing bakal dituduhake menyang pangguna nalika ngunjungi URL tartamtu.
Mangkene kerangka "aplikasi" kita:
<?php
//Файл: index.php
// Kickstart the framework
$f3=require('lib/base.php');
$f3->set('DEBUG', 1);
if ((float)PCRE_VERSION<8.0)
trigger_error('PCRE version is out of date');
$f3->config('config.ini');
//ВЕСЬ ОСТАЛЬНОЙ КОД БУДЕМ ПИСАТЬ ЗДЕСЬ
$f3->run();
Iku kabeh sampeyan kudu ngerti kanggo miwiti. Ayo miwiti coding!
//Файл: index.php
$f3->route('GET /',
function($f3) { //чтобы использовать функции F3 передаем его в роут
$view = new View; // создаем вьюшку
echo $view->render('home.htm'); //рендерим шаблон
}
);
Saiki sampeyan kudu nulis template iki. Kanggo gamblang aku digunakake bootstrap v5 alpfa.
Aja lali nggawe kabeh template ing folder kasebut ui, digunakake padha ora bakal katon kanggo framework
<!-- Файл: ui/home.htm -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="<?php echo $ENCODING; ?>" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Пишем (код), сокращаем (ссылки)!</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/5.0.0-alpha1/css/bootstrap.min.css" integrity="sha384-r4NyP46KrjDleawBgD5tp8Y7UzmLA05oM1iAEQ17CSuDqnUK2+k9luXQOfXJCJ4I" crossorigin="anonymous">
</head>
<body class="text-center bg-dark text-light"> <!-- темная тема ;) -->
<!-- менюшка -->
<nav class="m-2">
<ul class="nav nav-pills justify-content-center">
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="#">Главная</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Статья на Хабре</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://nikonovs.ru">Создатель</a>
</li>
</ul>
</nav>
<div class="container">
<h1>Короткие ссылки уже здесь.</h1>
<!-- Будем отправлять данные POST-запросом на /newLink -->
<form class="mt-5 mb-3" action="/jw/newLink/" method="POST">
<div class="row justify-content-center">
<div class="col-auto">
<label for="inputLink" class="col-form-label">Введи ссылку:</label>
</div>
<div class="col-auto">
<input required placeholder="https://" type="url" name="link" id="inputLink" class="form-control mb-1" aria-describedby="inputLink">
</div>
<div class="col-auto">
<button type="submit" class="btn btn-outline-primary">Сократить!</button>
</div>
</div>
</form>
<!-- немного -->
<p class="text-left m-auto mb-5" style="max-width: 30rem;">Lorem ipsum dolor sit, amet consectetur adipisicing elit. Omnis illum molestiae hic fugiat molestias nemo, architecto beatae repellat ullam exercitationem non ab, necessitatibus maxime quod iure ipsa quam quos! Reprehenderit. Lorem ipsum dolor, sit amet consectetur adipisicing elit. Necessitatibus eos sapiente voluptates veniam sequi delectus totam tenetur praesentium obcaecati. Repudiandae quisquam, ipsa ullam corrupti molestiae minima optio nihil est modi?</p>
<footer class="m-2">Сделано с <img width="20" height="20" src="https://image.flaticon.com/icons/svg/833/833472.svg" alt="любовью">, <a href="https://v5.getbootstrap.com/">пятым Bootstrap'ом</a> и <a href="https://fatfreeframework.com/">без жира</a></footer>
</div>
</body>
</html>
Iku kabeh, kaca utama kita wis bisa digunakake. Formulir ngirim panjalukan POST kanthi tautan sing kudu disingkat.
Saiki teka bagean sing nyenengake (ora).
Nggarap database
Ayo nggawe database - MySQL. Yen sampeyan wis nginstal PhpMyAdmin, banjur gawe database anyar "linker" banjur mbukak SQL iki:
SET SQL_MODE = "NO_AUTO_VALUE_ON_ZERO";
SET time_zone = "+00:00";
CREATE TABLE IF NOT EXISTS `links` (
`code` varchar(4) NOT NULL,
`link` varchar(1000) NOT NULL,
`hits` int(255) NOT NULL DEFAULT '0'
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
ALTER TABLE `links`
ADD UNIQUE KEY `code` (`code`);
Kita bakal duwe 3 kolom kanggo saben link:
Kode punika acak 4 karakter sawise domain liwat kang redirection bakal kelakon, kaya conto. com/ABC1
Link - Ora disingkat pranala.
Hits - jumlah klik ing link shortened.
Aku bakal pitutur marang kowe sedhela prinsip nggarap database, tanpa lemak.
<?php
//сначала нужно подключиться к БД
$db = new DBSQL(
'mysql:host=localhost;port=3306;dbname=linker',
'root',
''
);
//Дальше есть два варианда работы с данными:
//Можно установить переменную в Фреймворк c помощью обычного SQL-запроса:
$f3->set('result', $db->exec('SELECT * FROM wherever'));
//они будут доступны в шаблонах, как <?= $resul ? >
//А можно использовать встроенный SQL Mapper:
$row = new DBSQLMapper($db, 'links');
$row->load(array('link="https://habrahabr.ru"')); //теперь из этого объекта доступны все колонки строки, где ссылка на Хабр:
$row_value = $row->somerow; //Вот так
// Естесственно можно изменять значения:
$row->link = 'https://habr.com';
$row->save(); //изменения нужно сохранить, а что вы думали
// больше информации по работе с БД доступно здесь: https://a.nikonovs.ru/MPHR Настоятельно рекомендую прочитать, хотябы с помощью переводчика, встроенного в браузер.
?>
Ayo dadi miwiti shortening.
Ngolah link anyar
Nggawe Tampilan anyar ing indeks, sing bakal ngolah panjalukan saka formulir ing kaca utama.
Pisanan, ayo nggawe cithakan anyar, nanging meh padha karo cithakan pisanan (home.htm) - "newLink.htm".
Ing kana kita bakal nampilake tautan sing wis dicekak lan jumlah klik (kanggo ndeleng "statistik" iki maneh, sampeyan kudu nyepetake link sing padha maneh - alamat bakal tetep padha).
Kanggo ngasilake output, kita bakal nggunakake trick "passing variabel":
<?php
//Файл: нет (пример)
//устанавливаем переменную в index'е и рендерим шаблон
$f3->set('link', $shorted_link);
$view = new View;
echo $view->render('newLink.htm');
//теперь в шаблоне можно использовать:
<?= $link ?>
$f3->route('GET|POST /newLink', //мы будем обрабатывать и POST и GET
function($f3) {
$db = new DBSQL( //Подключение к БД новое в каждом Роуте
'mysql:host=localhost;port=3306;dbname=linker',
'root',
''
);
//прекрасная функция генерации радомных символов:
$permitted_chars = '0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZ';
function generate_string($input, $strength = 4) {
$input_length = strlen($input);
$random_string = '';
for($i = 0; $i < $strength; $i++) {
$random_character = $input[mt_rand(0, $input_length - 1)];
$random_string .= $random_character;
}
return $random_string;
}
//проверка на повторение link - нам же не нужно чтобы каждый раз генерировались новые ссылки. link - уникальный.
$check = new DBSQLMapper($db,'links');
$check->load(array('link="'. $link .'"'));
if ($check->dry()) {
$g_code = generate_string($permitted_chars);
$row = new DBSQLMapper($db,'links');
$row->reset();
$row->code = $g_code;
$row->link = $link;
$row->save();
} else {
$g_code = $check->code; //если link повторяется, то показываем старый код
}
$short_link = 'https://'. $_SERVER['HTTP_HOST'] . '/' . $g_code; //собираем конечную ссылку
//параметры из $_POST можно получить с помощью $f3->get('POST'), поддерживается точечная нотация (поправьте, если неправильно называю): параметр "link" можно получить так:
$link = $f3->get('POST.link');
if ( !empty($f3->get('POST')) ) { //Выдаем HTML, только если POST не пустой.
$f3->set('link', $short_link);
$f3->set('hits', $check->hits);
$view = new View;
echo $view->render('newLink.htm');
} else { //иначе - редирект на главную
$f3->$f3->reroute('/');
}
}
);
siyap! Bener, iku prasaja.
Pangalihan pangalihan
Ana mung sethithik sing kudu ditindakake:
Entuk parameter saka URL
Priksa ngarsane ing database
Entuk link sing cocog saka database
Pangalihan panganggo
Keuntungan!
Kita terus nulis kode sawise Rute pungkasan.
$f3->route('GET /@code', //указываем параметр после "@", он попадет в PARAMS
function($f3) {
//снова определяем $db
$db = new DBSQL(
'mysql:host=localhost;port=3306;dbname=linker',
'root',
''
);
$code = $f3->get('PARAMS.code'); //получаем параметр
$link = new DBSQLMapper($db,'links');
//если получается получить ссылку из БД - получаем, увеличиваем количество переходов и перенаправляем
if ($link->load(array('code="'.$code.'"', 'link=?'))) {
$link->hits++;
$link->save();
$f3->reroute($link->link);
} else {
$f3->reroute('/'); //а если такой ссылки нет - милости просим на главную
}
}
);
Sampeyan bisa uga wis ngeweruhi ing lan ing rute Link anyar, lan ing rute ndhuwur bab sing padha bakal ditetepake - sawise kabeh kode bisa cocog "newLink" (ora bisa, generator mung ngemot huruf gedhe), nanging wiwit ditetepake pisanan, iku bakal kaleksanan pisanan.
$f3→run()!
Matur nuwun kanggo maca!
Aku bakal bungah yen sampeyan nulis komentar lan mbenerake aku yen ana sing salah.
Lan minangka peer utawa bukti kesed penulis (aku), aku ninggalake dhaptar apa sing bisa ditindakake. Luwih becik sinau kanthi nindakake!
Iki mesthi ora mungkin, nanging nalika ngasilake $g_kode bisa kelakon maneh, aku suggest sampeyan nulis fungsi sing bakal mriksa iki.
Sampeyan uga bisa nggawe statistik normal lan nampilake sawise ngalih menyang /@kode/stats
Larang nggawe pranala menyang layanan shortening link dhewe, nggawe dhaptar sumber daya "dilindhungi" saka shortening
Aku banget nyaranake sanajan ing prakara cilik, sampeyan nindakake validasi input ing sisih server, kanthi kesalahan sing cocog ditampilake, sampeyan ora kudu ngandelake nambah atribut sing dibutuhake lan ketik = "url" menyang kolom input RedComrade