Ch09 在網頁之間傳遞資訊 網頁程式設計
大綱 蒐集網頁上的資料 HTTP Header Coolie Session 2019/4/16
蒐集網頁上的資訊 建立表單:表單的建立包含下列兩個部分: 1. 使用 <form> 和 <input> 元素撰寫表單的介面,例如單行文字方塊、選擇鈕、核取方塊等。 2. 撰寫表單的處理程式,也就是表單的後端處理,例如將表單資料傳送到電子郵件地址、寫入檔案、寫入資料庫或進行查詢等。 2019/4/16
form_home2.html <form action="showanswer.php" method="post" name="form1"> <div> <label><span class="largefont">姓名:</span> <input class="answerfont" type="text" name="stdname" size="20"> </label> </div> <label><span class="largefont">年級:</span></label> <input type="radio" name="stdgrade" value="1" checked> <label class="answerfont">一年級</label> <input type="radio" name="stdgrade" value="2">二年級 2019/4/16
<input type="radio" name="stdgrade" value="3">三年級 </div> <label><span class="largefont">可以參加輔導時段:</span></label> <div> <input type="checkbox" name="timetable[]" value="Mon" checked> <label class="answerfont">星期一</label> </div> <input type="checkbox" name="timetable[]" value="Tue"> <label class="answerfont">星期二</label> 2019/4/16
</div> <div> <input type="checkbox" name="timetable[]" value="Wed"><label class="answerfont">星期三</label> </div> <input type="checkbox" name="timetable[]" value="Thu"><label class="answerfont">星期四</label> <input type="checkbox" name="timetable[]" value="Fri"><label class="answerfont">星期五</label> </div> <div> <label><span class="largefont">輔導老師希望是:</span></label> 2019/4/16
<select name="wantedteacher[]" size="1"> <option value="wang">原授課老師 <option value="newteacher">業界老師 <option value="TA">助教 <option value="學長姐">學長姐 <option value="同學">同學 </select> </div> <div> <label><span class="largefont">我還有話要說:</span></label> <textarea name="talking" cols="40" rows="3">我沒有意見</textarea> 2019/4/16
<input type="submit" value="傳送"> <div> <input type="submit" value="傳送"> <input type="reset" value="重新輸入"> </div> </form> 2019/4/16
表單的後端處理 將表單資訊以E-mail 形式傳送給指定的收件人 若要將表單資訊以 E-mail 形式傳送給指定的收件人,可以使用 <form>...</form> 標籤的 action 屬性設定收件人的電子郵件地址,例如: 讀取表單資訊並製作成確認網頁 為了讓瀏覽者知道其所輸入的表單資訊已經成功傳回Web伺服器,我們通常會在瀏覽者點取 [提交] 按鈕後顯示確認網頁,例如: <form method="post" action="mailto:jean@hotmail.com"> <form method="post" action="confirm.php"> 2019/4/16
showanswer.php <!doctype html> <html> <head> <meta charset="utf-8"> <title>確認頁 </title> </head> <body> <?php $stdname = $_POST["stdname"]; echo $stdname . "你好,<br>"; 2019/4/16
switch($_POST["stdgrade"]) { case 1: echo "一年級<br>"; break; } 2019/4/16
foreach($_POST["timetable"] as $Value) $str = "可以參加輔導的時間是:"; foreach($_POST["timetable"] as $Value) $str = $str . $Value . " ,"; echo $str . "<br>"; $str = "希望的輔導老師:"; foreach($_POST["wantedteacher"] as $Value) $str = $str . $Value . " "; echo "其他意見:" . $_POST["talking"] . "<br>"; ?> </body> </html> 2019/4/16
HTTP Header 我們可以使用PHP內建的函式header() 傳送自訂的HTTP Header,常見的應用有網頁重新導向、使用者與密碼認證等,其語法如下: 下面是一個例子 header(string string [, bool replace [, int http_response_code]]) <?php header('WWW-Authenticate: Negotiate'); header('WWW-Authenticate: NTLM', FALSE); ?> 2019/4/16
5秒後,轉向新網頁 header('Refresh: 5; URL=http://localhost/test_redir_p3.php'); <meta http-equiv="refresh" content="5;url=http://jsfiddle.net/"> 2019/4/16
倒數?秒後,轉向新網頁(Javascript) <form name="redirect" id="redirect"> You Will Be Redirected To Next Page After <input size="1" name="redirect2“ id="counter"></input>Seconds. </form> <script type="text/javascript"> var countdownfrom=5 var currentsecond=document.redirect.redirect2.value=countdownfrom+1 function countredirect(){ if (currentsecond!=0){ currentsecond-=1 document.redirect.redirect2.value=currentsecond } else{ showIt() return } setTimeout("countredirect()",1000) } countredirect() function showIt() { window.location.href = "http://localhost/w9/test_redir_p3.php"; } </script> 2019/4/16
Cookie 寫入Cookie:使用PHP內建的函式setcookie() 寫入Cookie,其語法如下 下面是一個例子: setcookie(string name[, string value[, int expire[, string path[, string domain[, bool secure]]]]]) <?php header(“Content-type: text/html; charset=utf-8”); //指定網頁編碼方式為UTF-8 setcookie("UserName", "小丸子", time() + 60 * 60 * 24); setcookie("UserAge", 10, time() + 60 * 60 * 24); ?> 2019/4/16
Cookie 讀取Cookie:透過 $_COOKIE變數讀取Cookie,例如: setcookie("UserName", "Mary"); echo $_COOKIE["UserName"]; 先開啟瀏覽器執行這個程式,然後重新整理網頁,就會出現此結果。 2019/4/16
Session Session的用途是記錄用戶端的資訊,而且每個用戶端擁有各自的Session,如下圖: 2019/4/16
Session 存取Session:PHP支援的Session包含下列兩個部分: Session ID (SID) Session變數 網頁上顯示的次數取決於您在本瀏覽器載入此網頁的次數,比方說,您只要重複點取 [重新整理] 按鈕,次數就會逐一遞增。 2019/4/16
Session相關函式 PHP內建數個Session相關函式,比較重要的如下: session_start() session_unset() session_destroy() session_id([string id]) session_name([string name]) session_regenerate_id() session_encode() session_decode(string data) session_write_close() session_save_path([string path]) session_set_cookie_params(int lifetime [, string path [, string domain [, bool secure]]]) session_get_cookie_params(): 2019/4/16
test_redir_p1.php <!doctype html> <html> <head> <meta charset='utf-8'> <title>網頁轉向測試第一頁</title> </head> <body> 這是第一頁<br> <form method="post" action="test_redir_p2.php"> 姓名: <input type="text" name="username" size="10" required> <input type="submit" value="提交"> </form> </body> </html> 2019/4/16
test_redir_p2.php <?php session_start(); ?> <!doctype html> <html> <head> <meta charset='utf-8'> <title>網頁轉向測試第二頁</title> </head> <body> 這是第二頁<br> <?php $username=$_POST["username"]; echo $username . "Hi!"; setcookie("user1", $username , time()+60*60); $_SESSION['qq'] = $username; echo $_COOKIE["user1"]; //header('Refresh: 5; URL=http://localhost/w9/test_redir_p3.php'); //<meta http-equiv="refresh" content="5;url=http://localhost/w9/test_redir/p3.php"> ?> 2019/4/16
2019/4/16 <form name="redirect" id="redirect"> You Will Be Redirected To Next Page After <input size="1" name="redirect2" id="counter"></input>Seconds. </form> <script type="text/javascript"> var countdownfrom=5 var currentsecond=document.redirect.redirect2.value=countdownfrom+1 function countredirect(){ if (currentsecond!=0){ currentsecond-=1 document.redirect.redirect2.value=currentsecond } else{ showIt() return } setTimeout("countredirect()",1000) } countredirect() function showIt() { window.location.href = "http://localhost/w9/test_redir_p3.php";} </script> </body> </html> 2019/4/16
test_redir_p3.php <?php session_start(); ?> <!doctype html> <html> <head> <meta charset='utf-8'> <title>網頁轉向測試第三頁</title> </head> <body> 這是第三頁<br> <?php echo $_SESSION['qq']; echo $_COOKIE['user1']; ?> </body> </html> 2019/4/16