owned this note
owned this note
Published
Linked with GitHub
0220-網頁前端設計與開發運用培訓班
===
###### tags: `德鍵`
一、刪除會員
1. 指令：user.php?op=op_delete&uid=1
位置：user.php => op=op_list
圖示：`<i class="far fa-trash-alt"></i>`
[void](https://kuro.tw/posts/2019/08/04/JS-%E5%86%B7%E7%9F%A5%E8%AD%98-%E4%BD%A0%E6%89%80%E4%B8%8D%E7%9F%A5%E9%81%93%E7%9A%84-void/)
[sweetalert2](https://sweetalert2.github.io/)
2. 流程：
```php
case "op_delete" :
$msg = op_delete($uid);
redirect_header("user.php", $msg, 3000);
exit;
```
3. 函式：
```php
/*=======================
刪除會員函式
=======================*/
function op_delete($uid){
global $db;
$sql="DELETE FROM `users`
WHERE `uid` = '{$uid}';
";
$db->query($sql) or die($db->error() . $sql);
return "會員刪除成功";
}
```
二、 sweetalert2 使用方法
1. 引入
```htmlmixed=
<!-- sweetalert2 -->
<link rel="stylesheet" href="<{$xoAppUrl}>class/sweetalert2/sweetalert2.min.css">
<script src="<{$xoAppUrl}>class/sweetalert2/sweetalert2.min.js"></script>
```
2. 調用
請參考：[sweetalert2](https://sweetalert2.github.io/)
三、指令完成程式碼
按鈕
```htmlmixed=
<a href="javascript:void(0)" onclick="op_delete(<{$row.uid}>);"><i class="far fa-trash-alt"></i></a>
```
```htmlmixed=
<!-- sweetalert2 -->
<link rel="stylesheet" href="<{$xoAppUrl}>class/sweetalert2/sweetalert2.min.css">
<script src="<{$xoAppUrl}>class/sweetalert2/sweetalert2.min.js"></script>
<script>
function op_delete(uid){
Swal.fire({
title: '你確定嗎？',
text: "您將無法還原！",
icon: 'warning',
showCancelButton: true,
confirmButtonColor: '#3085d6',
cancelButtonColor: '#d33',
confirmButtonText: '是的，刪除它！'
}).then((result) => {
if (result.value) {
//確定要刪除的動作
document.location.href="user.php?op=op_delete&uid="+uid;
}
})
}
</script>
```
三、登入
1. 表單：`index.php?op=login_form`
2. 登入： `action="index.php" op=login`
3. 原本函式：
```php
function login(){
global $smarty;
$name="admin";
$pass="111111";
$token="xxxxxx";
if($name == $_POST['name'] and $pass == $_POST['pass']){
$_SESSION['admin'] = true;
$_POST['remember'] = isset($_POST['remember']) ? $_POST['remember'] : "";
if($_POST['remember']){
setcookie("name", $name, time()+ 3600 * 24 * 365);
setcookie("token", $token, time()+ 3600 * 24 * 365);
}
return "登入成功";
}else{
return "登入失敗";
}
}
```
4. 程式故事
* 表單送來「帳號」、「密碼」 (原本是送 name)
* 把「帳號」、「密碼」與「users」資料表 做比對
* 比對成功 =>
* 比對失敗 =>
5. 修改「login_form.tpl」=> name -> uname
6. login()
```php
function login(){
global $db;
#過濾變數
$_POST['uname'] = db_filter($_POST['uname'], '帳號');
$_POST['pass'] = db_filter($_POST['pass'], '密碼');
if(checkByUnamePass($_POST['uname'],$_POST['pass'])){
$_SESSION['admin'] = true;
$_POST['remember'] = isset($_POST['remember']) ? $_POST['remember'] : "";
if($_POST['remember']){
setcookie("uname", $_SESSION['user']['uname'], time()+ 3600 * 24 * 365);
setcookie("token", $_SESSION['user']['token'], time()+ 3600 * 24 * 365);
}
return "登入成功";
}else{
return "登入失敗";
}
}
```
7. logout()
```php
function logout(){
$_SESSION['admin']="";
setcookie("uname", "", time()- 3600 * 24 * 365);
setcookie("token", "", time()- 3600 * 24 * 365);
}
```
8. 帳號、密碼登入
`checkByUnamePass($uname,$pass)`
```php
/*=======================
用uname與pass登入
=======================*/
function checkByUnamePass($uname,$pass){
global $db;
$user = getUserByUname($uname);
if(password_verify($pass, $user['pass'])){
$_SESSION['user']['uid'] = (int)$user['uid'];
$_SESSION['user']['uname'] = htmlspecialchars($user['uname']);
$_SESSION['user']['name'] = htmlspecialchars($user['name']);
$_SESSION['user']['tel'] = htmlspecialchars($user['tel']);
$_SESSION['user']['email'] = htmlspecialchars($user['email']);
$_SESSION['user']['kind'] = (int)$user['kind'];
$_SESSION['user']['token'] = htmlspecialchars($user['token']);
return true;
}else{
$_SESSION['user']['uid'] = "";
$_SESSION['user']['uname'] = "";
$_SESSION['user']['name'] = "";
$_SESSION['user']['tel'] = "";
$_SESSION['user']['email'] = "";
$_SESSION['user']['kind'] = "";
$_SESSION['user']['token'] = "";
return false;
}
}
```
9. 用uname取得user
`getUserByUname($uname)`
```php
/*=======================
用uname取得user
=======================*/
function getUserByUname($uname){
global $db;
$sql="SELECT *
FROM `users`
WHERE `uname`='{$uname}'
";
$result = $db->query($sql) or die($db->error() . $sql);
$row = $result->fetch_assoc();
return $row;
}
```
四、測試
1. 建立「管理員」與「會員」各一個，然後登入，看看發生什麼事情
2. 目前程式對「管理員」與「會員」是一樣的，因為我們只要登入成功一律
設 `$_SESSION['admin'] = true;`
3. 將「`<{$smarty.session.user.kind}>`」顯示在首頁，並查看其值變化，登入「管理員」、「會員」與登出時應該不一樣
4. 因此我們準備將會員的判斷改用「`$_SESSION['user']['kind']`」
5. head.php
```php
$_SESSION['user']['kind'] = isset($_SESSION['user']['kind']) ? $_SESSION['user']['kind'] : "";
```
6. head.php
這裡有調用「`getUserByUname($uname)`」所以必須將 index.php 的此函式，調至 function.php
```php
$_SESSION['user']['kind'] = isset($_SESSION['user']['kind']) ? $_SESSION['user']['kind'] : "";
# 為了cookie使用
if($_SESSION['user']['kind'] === ""){
$_COOKIE['token'] = isset($_COOKIE['token']) ? $_COOKIE['token'] : "";
$_COOKIE['uname'] = isset($_COOKIE['uname']) ? $_COOKIE['uname'] : "";
checkByUnameToken($_COOKIE['uname'],$_COOKIE['token']);
}
/*=======================
用uname與token登入
=======================*/
function checkByUnameToken($uname,$token){
global $db;
$user = getUserByUname($uname);
if($token === $user['token']){
$_SESSION['user']['uid'] = (int)$user['uid'];
$_SESSION['user']['uname'] = htmlspecialchars($user['uname']);
$_SESSION['user']['name'] = htmlspecialchars($user['name']);
$_SESSION['user']['tel'] = htmlspecialchars($user['tel']);
$_SESSION['user']['email'] = htmlspecialchars($user['email']);
$_SESSION['user']['kind'] = (int)$user['kind'];
$_SESSION['user']['token'] = htmlspecialchars($user['token']);
return true;
}else{
$_SESSION['user']['uid'] = "";
$_SESSION['user']['uname'] = "";
$_SESSION['user']['name'] = "";
$_SESSION['user']['tel'] = "";
$_SESSION['user']['email'] = "";
$_SESSION['user']['kind'] = "";
$_SESSION['user']['token'] = "";
return false;
}
}
```
7. 搜尋程式「`$_SESSION['admin']`」與樣板「$smarty.session.admin」然後修改
8. 測試 cookie
在 head.php => `$_SESSION['user']['kind'] = ""`
9. 至此會員機制應該剩下，檢查帳號與email不重覆應該就很完整了
企劃書範本
https://drive.google.com/drive/folders/1bnSaaeFDFRiSQ3VymHIPBVGwHxjKME8W?usp=sharing
Sign in with Wallet
