Download presentation
Presentation is loading. Please wait.
1
PHP in Biological Data Retrieval
生物資訊程式語言應用 Part 8 PHP in Biological Data Retrieval
2
Getting Started Protein name
3
Getting Started
4
function、subcellular location
Practice 搜尋一個蛋白質，並找出他的 function、subcellular location
5
Getting Started
6
Getting Started
7
HTML 表單介紹 何謂表單 (Forms) HTML 控制項種類 一群 HTML 控制項(Controls)的集合 下拉式功能表
文字輸入框 密碼輸入框 選擇清單 送出 / 清除紐 多列文字區 一般按鈕 檔案上傳紐 單選按鈕 多選按鈕
8
HTML 表單介紹 HTML 表單 (Form) 範例 格式 表單處理網頁 URL 後送法
<form action=“表單處理網頁URL” method=“後送法”> 表單處理網頁 URL 當表單被按下 “送出” 時，表單內所有控制項內含值會被送到此處 後送法 有 GET 及 POST 兩種，其差異容後詳談 範例 <form action=“ method=“GET”>
9
HTML 表單介紹 文字輸入框 (Textbox) 格式 範例
<input type=“text” name=“後送變數名稱” size=“長度” maxlength=“最大輸入長度” value=“輸入值” > 紅色字部分可以省略 範例 <input type=“text” name=“txtUserName” size = “20” maxlength=“50” value=“”>
10
HTML 表單介紹 隨堂練習 請輸入下列程式碼，看看是否能夠顯示文字輸入框 請修改 size 屬性的值。輸入框的外觀是否變大了呢？
請修改 maxlength 的值為 5，再輸入文字看看。請問您可以輸入幾個字？ 請修改 value=“請輸入帳號” ，有什麼變化？ <html> <head> <title> Form Test </title> </head> <body> <form> 請輸入帳號： <input type=“text” name=“txtUserName” size=“20” maxlength=“50” value=“”><br> </form> </body> </html>
11
HTML 表單介紹 密碼輸入框 (Password) 格式 範例
<input type=“password” name=“後送變數名稱” size=“長度” maxlength=“最大輸入長度” value=“輸入 值” > 紅色字部分可以省略 範例 <input type=“password” name=“txtPassword” size = “20” maxlength=“50” value=“”>
12
HTML 表單介紹 隨堂練習 請輸入下列程式碼，看看是否能夠顯示密碼輸入框 <html> <head>
<title> Form Test </title> </head> <body> <form> 請輸入帳號： <input type=“text” name=“txtUserName” size=“20” maxlength=“50” value=“”><br> 請輸入密碼： <input type=“password” name=“txtPassword” size=“20” maxlength=“50” value=“”><br> </form> </body> </html>
13
HTML 表單介紹 多列文字區 (Text Area) 格式 範例
<textarea name=“後送變數名稱” rows=“列數” cols=“行數” wrap=“是否傳送換列符號”> 初始字串 </textarea> 紅色字部分可以省略 是否傳送換列符號 有三種選擇 off: 所有換列符號皆不後送 soft: 只傳送使用者實際按下 Enter 的換列符號 hard: 所有螢幕上折行的位置皆後送換列符號 範例 <textarea name=“txtMessage” rows=“10” cols=“40” wrap=“soft”> 請在此處輸入您的意見 </textarea>
14
HTML 表單介紹 隨堂練習 請輸入下列程式碼，看看是否能夠顯示多列文字區 <html> <head>
<title> Form Test </title> </head> <body> <form> 請輸入您的意見<br> <textarea name=“txtMessage” rows=“10” cols=“40” wrap=“soft”> </textarea> </form> </body> </html>
15
HTML 表單介紹 單選按鈕 (Radio Button) 格式 範例 注意事項
<input type=“radio” name=“後送變數名稱” value=“後送值” checked> 紅色字部分可以省略 checked 設定此單選按鈕是否預設為勾選 範例 <input type=“radio” name=“rdoSex” value=“male” checked>男性 <input type=“radio” name=“rdoSex” value=“female”>女性 注意事項 所有同一組的單選按鈕之後送變數名稱必須相同，否則會被視為不同群 組。 以上例而言，若使用者勾選 “女性”，則 PHP 會收到一個變數名為 $rdoSex，其內容值為 “female”
16
HTML 表單介紹 隨堂練習 請輸入下列程式碼，看看是否能夠顯示單選按鈕 <html> <head>
<title> Form Test </title> </head> <body> <form> 性別： <input type=“radio” name=“rdoSex” value=“male” checked> 男性 <input type=“radio” name=“rdoSex” value=“female”> 女性 </form> </body> </html>
17
HTML 表單介紹 多選按鈕 (Checkbox) 格式 範例
<input type=“checkbox” name=“後送變數名稱” value=“後送值” checked> 紅色字部分可以省略 checked 設定此多選按鈕是否預設為勾選 範例 <input type=“checkbox” name=“chkRemember” value=“yes”> 記住我的密碼
18
HTML 表單介紹 多選按鈕注意事項 每個多選按鈕後送變數名稱必須不同，否則將會發生只收到最後一個勾選 的後送值之情況。
請輸入您的嗜好： <input type=“checkbox” name=“hobbies” value=“eat”> 吃 <input type=“checkbox” name=“hobbies” value=“drink”> 喝 <input type=“checkbox” name=“hobbies” value=“sex”> 嫖 <input type=“checkbox” name=“hobbies” value=“gamble”> 賭 若使用者勾選上述四者，後端的 PHP 處理網頁只會收到 $hobbies = “gamble”。 PHP 允許使用陣列來儲存 checkbox 每個內容值 請輸入您的嗜好： <input type=“checkbox” name=“hobbies[]” value=“eat”> 吃 <input type=“checkbox” name=“hobbies[]” value=“drink”> 喝 <input type=“checkbox” name=“hobbies[]” value=“sex”> 嫖 <input type=“checkbox” name=“hobbies[]” value=“gamble”> 賭 若使用者勾選上述四者，後端的 PHP 處理網頁會收到如下的值 hobbies[0] = “eat”; hobbies[1] = “drink”; hobbies[2] = “sex”; hobbies[3] = “gamble”;
19
HTML 表單介紹 隨堂練習 請輸入下列程式碼，看看是否能夠顯示多選按鈕 <html> <head>
<title> Form Test </title> </head> <body> <form> 請輸入您的嗜好： <input type=“checkbox” name=“hobbies[]” value=“eat”> 吃 <input type=“checkbox” name=“hobbies[]” value=“drink”> 喝 <input type=“checkbox” name=“hobbies[]” value=“sex”> 嫖 <input type=“checkbox” name=“hobbies[]” value=“gamble”> 賭 </form> </body> </html>
20
HTML 表單介紹 下拉式功能表 (Combo Box) 格式 範例
<select name=“後送變數名稱”> <option value=“後送值1” selected>選項名稱1 <option value=“後送值2” >選項名稱2 … </select> selected 將此選項預設為被選取 選項名稱 秀在下拉式功能表裡的文字 範例 請輸入您所在的城市： <select name=“cmbCity”> <option value=“taipei” selected>台北市 <option value=“taichung”>台中市 <option value=“kaoshung”>高雄市 </select>
21
HTML 表單介紹 隨堂練習 請輸入下列程式碼，看看是否能夠顯示下拉式功能表 <html> <head>
<title> Form Test </title> </head> <body> <form> 請輸入您所在的城市： <select name=“cmbCity> <option value=“taipei” selected>台北市 <option value=“taichung”>台中市 <option value=“kaoshung”>高雄市 </select> </form> </body> </html>
22
HTML 表單介紹 選擇清單 (List) 格式：與下拉式功能表完全相同
<select name=“後送變數名稱” size=“清單項目顯示數” multiple> <option value=“後送值1” selected>選項名稱1 <option value=“後送值2” >選項名稱2 <option value=“後送值3” selected>選項名稱3 … </select> 清單顯示項目數 指定此一清單要顯示幾個項目。若實際項目數量大於此值，則該清單會出現捲動軸 multiple 設定此清單是否可以多選 若可以多選時，則用 ctrl + 滑鼠左鍵可以選擇不連續的項目 若用 shift + 滑鼠左鍵可以選擇一群連續的項目
23
HTML 表單介紹 範例 請問您家中有些什麼人 <select name=“lstFamily[]” size=“5” multiple> <option value=“father”>爸爸 <option value=“mother” >媽媽 <option value=“brother” >兄弟 <option value=“sister” >姊妹 </select>
24
HTML 表單介紹 隨堂練習 請輸入下列程式碼，看看是否能夠顯示選擇清單 <html> <head>
<title> Form Test </title> </head> <body> <form> 請問您家中有些什麼人 <select name=“lstFamily[]” size=“5” multiple> <option value=“father”>爸爸 <option value=“mother” >媽媽 <option value=“brother” >兄弟 <option value=“sister” >姊妹 </select> </form> </body> </html>
25
接取網頁變數 前端傳送方法 – GET 以 GET 傳送 範例
<form action=“後端處理網頁名稱” method=“GET”> 範例 <form action=“login.php” method=“GET”> 登入名稱：<input type=“text” name=“txtName”><br> 登入密碼：<input type=“password” name=“txtPass”><br> <input type=“submit” name=“btnSubmit” value=“送出”> <input type=“reset” name=“btnReset” value=“清除”> </form>
26
接取網頁變數 前端傳送方法 – GET 以 GET 傳送的 HTTP 封包長相 優點 缺點
使用者可以 Bookmark 此一動態網頁，隨時秀出使用者當初看 到的樣子。 缺點 所有訊息全部附在 URL 尾端的 CGI 變數區傳送出去。使用者對 於傳送什麼可以看得一清二楚，無法對傳送資料保密。 受限於瀏覽器對 URL 設下的最大長度限制 (如：IE 2048 bytes，NS 1024 bytes) 無法用 GET 方法上傳檔案 GET login.php?txtName=Robert&txtPass=1234 HTTP/1.1 HOST: User-agent: Mozilla/5.0
27
接取網頁變數 前端傳送方法 – POST 以 POST 傳送 範例
<form action=“後端處理網頁名稱” method=“POST”> 範例 <form action=“login.php” method=“POST”> 登入名稱：<input type=“text” name=“txtName”><br> 登入密碼：<input type=“password” name=“txtPass”><br> <input type=“submit” name=“btnSubmit” value=“送出”> <input type=“reset” name=“btnReset” value=“清除”> </form> 與正常網址無異
28
接取網頁變數 前端傳送方法 – POST 以 POST 傳送的 HTTP 封包長相 優點 缺點
不受限於瀏覽器對 URL 設下的最大長度限制 使用者可以上傳檔案 缺點 HTTP 封包中的文字仍為明碼，有心人士仍可經過較為複雜的手續攔截 得知後送了哪些變數及值。 POST login.php HTTP/1.1 HOST: User-agent: Mozilla/5.0 Content-Type: application/x-www-form-urlencoded Content-Length: 27 txtName=Robert&txtPass=1234
29
Post 和 Get 傳送方式 表單資料可以用 <FORM> 元件的 method 屬性 來指定 Post 或 Get 傳回方式。Post 方式是把 資料用符合 HTTP 通訊協定的格式，以封包的 形式傳回 WWW 伺服器。這種方式適合傳送資 料量比較大的表單（譬如超過 1K bytes）。 Get 方式則是把表單資料附加在 action 屬性指 定的 URL 後面，傳回 WWW 伺服器。由於 URL 的字元長度有限（通常不得超過 1K bytes）， 所以 Get 方式適合資料量少的表單。除了資料 量的差異外，在安全性方面，Post 方式比 Get 方式來得好。由於網路安全的考量因素，我們 建議你採用 Post 方式來傳送表單，即使表單的 資料並不多。
30
GET與POST的差異 GET傳送的字元長度不得超過256個字元 在傳送密碼欄位時
$_GET 與 $_POST 也是PHP內建的超全域陣列 (superglobal array) 同 $_SERVER變數 第9章 在網頁之間傳遞資訊 2008/4/14
31
Practice 打開網頁的原始碼
32
如何分辨get及post GET POST method=“get" method="post"
33
Protein data bank (PDB)
34
Protein data bank (PDB)
35
Protein data bank (PDB)
36
Gene ontology (GO) 練習：進入網站、開原始碼 示範：搜尋post、搜尋get、在三個get中找出method
37
Gene ontology (GO) 練習：改變網址的ESR，看看會有什麼影響
38
Gene ontology (GO) 示範：尋找Name(s)、Estrogen receptor 練習：尋找其他欄位
39
Practice 判斷網頁是用GET或POST傳遞 http://www.ncbi.nlm.nih.gov/
判斷網頁是用GET或POST傳遞
40
program index.php
41
program search.php
42
Practice 抓取其他欄位
43
program index.php
44
program search.php
45
program search.php
46
Practice 抓取其他欄位
47
抓取圖片
48
抓取圖片
Similar presentations
