【PHP+MYSQL】實現登入介面的學習筆記
阿新 • • 發佈：2019-01-02
目標
利用php和MySQL實現登入介面工具
1.wampserver(簡單易上手的整合安裝環境！) 2.notepad++（或dw,嫌麻煩記事本也可以！）步驟
一、首先安裝wampserver
第一步：在百度軟體中心下載wampserver
第二步：安裝
安裝過程很簡單，基本都是直接下一步就行。需要注意的是有些可能不太懂這一個，這個是選擇Windows瀏覽器，直接點選開啟即可。第三步：開啟wampserver軟體
你會看到右下角有一個綠色的（或者黃色、紅色“w”圖示） 右鍵選擇偉大的Chinese就ok啦！
第四步：解決埠問題（如果你執行第三步時發現圖示是綠的就不用管這個步驟）
二、資料庫設計
上一個步驟我們已經將php的環境部署完畢weampserver中也自帶MySQL資料庫這一步我們要建立資料庫，和表如何建立表呢？
第一步：點選phpMyAdmin，會開啟你的瀏覽器位址列上是http://localhost/phpmyadmin/ 你看的的介面是如圖，讓管理者可用Web介面管理MySQL資料庫
（如果你在上一步驟中，修改了埠那你的手動輸入以下地址了http://localhost：90/phpmyadmin/）
第二步：建立資料庫—點選資料庫—建立資料庫（例如：mylogin）
第三步：建立表—在左側選擇你的資料庫—新建資料表—填寫你的欄位（如：表名 logintable，欄位名 l_id l_name l_password,）—點選右下角的“儲存”
第四步：在右邊你會看到你剛建的表—點選表—選中上欄的“插入”—輸入你的值（例如：如下）
三、測試你的php檔案能否連線資料庫
第一步：開啟你的wampserver的安裝目錄，找到www資料夾（記住這個資料夾，以後我們要測試的網頁都要放到這個資料夾下）第二步：用notepad++或記事本開啟“testmysql.php”這個檔案。這是一個連線資料庫的php問件。
第三步：修改你的資料庫使用者名稱和密碼，因為我們的資料庫名和密碼都沒有改，所以是預設的，將hostname改為localhost，dbuser改為root，將dbpassword刪掉（單引號得留著）儲存。如下：
第四步：在瀏覽器中輸入http://localhost/testmysql.php，瀏覽器中顯示Connection OK ，則為連線成功。<?php $link = mysql_connect(<span style="color:#009900;">'localhost','root','</span>'); if (!$link) { die('Could not connect to MySQL: ' . mysql_error()); } echo 'Connection OK'; mysql_close($link); ?>
四、設計你的登入介面
以上我們已經將所有準備工作都做完了，下一步便是設計我們的登入介面。第一步：首先在www資料夾下建立我們的一個資料夾來存放我們這個專案的檔案，就叫“login”吧。
第二步：建立一個html檔案， （例如：login.html） 程式碼如下：
<html>
<head>
<title>登入</title>
<script language="javascript"type="text/javascript" >
function check(){
var name=LoginForm.username.value;
var pwd=LoginForm.password.value;
if(name==""){
alert("請輸入使用者名稱~");
LoginForm.username.focus();
return (false);
}
if(pwd==""){
alert("請輸入密碼~");
LoginForm.password.focus();
return (false);
}
}
</script>
</head>
<body>
<div class="center">
<form name="LoginForm" method="post"action="login.php" onsubmit="return check(this)">
使用者名稱:<input name="username" type="text"id="username"/><br />
密 碼:<inputname="password" type="password"id="password"/><br/>
<input value="登入" type="submit" name="submit"/>
<input value="註冊" type="button"onclick="javascrtpt:window.location.href='register.html'"/><br/>
</form>
</div>
</body>
</html>程式碼如下：
<?php
//訪問資料庫,讀取資料
$conn [email protected]_connect("<span style="color:#33cc00;">localhost"</span>,"<span style="color:#009900;">root</span>","");
if (!$conn){
die("資料庫連線失敗: " . mysql_error());
}
mysql_select_db("<span style="color:#009900;">mylogin</span>",$conn);
//mylogin是我們資料庫的名字
mysql_query("set character set 'gbk'");
mysql_query("set names 'gbk'");
?>程式碼如下：
<?php
//啟動session會話
session_start();
//登出登入
$var = isset($_GET['action']) ? $_GET['action'] : '';
if ($var == "logout"){
unset($_SESSION['userid']);
unset($_SESSION['username']);
echo '登出登入成功！點選此處<a href=<span style="color:#009900;">"login.html"</span>>登入</a>';
exit;
}
//登入
if (!isset($_POST['submit'])){
exit('非法訪問！');
}
$username = trim($_POST['<span style="color:#009900;">l_name</span>']);
$password = trim($_POST['<span style="color:#009900;">l_password</span>']);
//訪問資料庫，進行連線
include("conn.php");
//檢查使用者名稱密碼
$sql = "<span style="color:#009900;">select l_id from logintable where l_name="."'$username'"." and l_password="."'$password'"</span>;
$result = mysql_fetch_array(mysql_query($sql));
if ($result){
//登入成功
$_SESSION['username']=$username;
$_SESSION['userid']=$result['<span style="color:#009900;">l_id</span>'];
echo $username.'歡迎你！<br />';
echo '點選此處<a href="login.php?action=logout">登出</a>登入！<br/>';
}else{
exit('失敗咯！快點選此處<a href="javascript:history.back(-1);">返回</a>重試');
}
?>五、萬事具備，只欠測試
回到瀏覽器輸入http://localhost/login/login.html
在輸入框內輸入你在資料庫表中輸入的資料，看一下你是否能登入成功。如果不成功看一下程式碼和相關欄位能否相對應。