Learning - Fat-Free PHP Framework (Bootstrap & Authentication)
Bootstrap & Authentication
Bootstrap
Front design, https://getbootstrap.com, includes CCS, Components, etc.
Getting start has examples, sign in page can be downloaded as well.
Bootstrap CDN - Content delivery network online
Content to be included
Include css into the head tag of the page
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
Include the java script just before the closing of body tag
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
Create structure for login page
-
Create
app/views/login.htm -
Create
app/models/User.php -
Create
app/controllers/UserController.php -
Create
app/css/signin.cssor a static folder for this -
Copy bootstrap login sample html to
login.htm -
Copy bootstrap login sample css to
signin.css
Create page
-
Clean up
login.htm -
Create
UserController.php
class UserController extends Controller {
function render() {
$template = new Template;
echo $template->render('login.htm');
}
}
- Update
routes.ini
Add
GET /login=UserController->render
The login page built as https://localhost:8088/login
Customize login page
Remove Remember me and change variable names, and name attribute for input fields
Authentication
Update routes.ini
Add following line
POST /authenticate=UserController->authenticate
Update form in login.htm
<form class="form-signin" method="POST" action="/authenticate">
Create table
Create table user with id, username, password.
Create password
$ php -a
echo password_hash('f3password', PASSWORD_DEFAULT);
$2y......
Add user and password
Add an user with username=f3user and the password=$2y......
Create model for user
Create User.php by modifying Messages.php
class User extends DB\SQL\Mapper {
public function __construct(DB\SQL $db) {
parent::__construct($db, 'user');
}
public function getByName() {
$this->load(array('username=?', $name));
}
public function all() {
$this->load();
return $this->query;
}
...
*Note: Function all() can be used to assign to a variable, getByName() is return the object itself.
Add authenticate function in UserController class
function authenticate() {
$username = $this->f3->get('POST.username');
$password = $this->f3->get('POST.password');
$user = new User($this->db);
$user->getByName($username);
if ($user->dry()) {
// echo 'User does not exist.';
$this->f3->reroute('/login')
}
if (password_verify($password, $user->password)) {
// echo 'password OK';
$this->f3->reroute('/');
}
else {
// echo 'password NOT OK';
$this->f3->reroute('/login')
}
}
Note: dry() is db function.
Create session
Look for Fat-Free Session Handler
- Enable cache
Add following line in config.ini
CACHE=true
- Update index.php
...
new Session();
$f3->run();
- Add following line in function
authenticateinUseControllerclass
if (password_verify($password, $user->password)) {
$this->f3->set('SESSION.user', $user->usename)'
$this->f3->reroute('/');
}
Update function beforeroute in Controller class
function beforeroute() {
if ($this->f3->get('SESSION.user') === null) {
$this->f3->reroute('/login');
exit;
}
}
Update UserController class
Because this update is in Controller class, so every page will go thru the verification. To ignore this behavior for login.htm, update UserController class. Adding following empty function to overwrite beforeroute()
function beforeroute() {
}
References
Adding Bootstrap and User Authentication to Fatfree PHP MVC Project