寫在前面
PHP
在之前的學習過程中我們接觸過前后台數據請求交互的方法有表單提交、AJAX請求以及Angularjs中的$http,今天我們嘗試在PHP中使用 $_GET 與$_POST 實現簡單的前后台數據傳輸交互功能;
PHP中給我們提供了一群功能十分強大的超全局 數組,它們 可以在任何位置,任何作用域之內使用,而且無需聲明,拿到即可使用!
又稱 : 超全局數組、超全局變量、預定義數組、預定義變量
這篇文章里我們單獨講一下
PHP 中的$_GET 變量和$_POST變量
① 在 PHP 中,預定義的 $_GET 變量用於收集來自 method="get" 的表單中的值。即用來獲取前台通過get請求發送的數據。
② 預定義的 $_POST 變量用於收集來自 method="post" 的表單中的值。即用來獲取前台通過post發送的數據。
順便我們回顧下表單的一些基礎知識:
1、 form表單的兩個重要屬性
action:表示表單提交的服務器地址
method:表單提交數據的方式,可選值有get、post兩種。
2、get、post的區別
get通過URL傳遞數據,所有內容在URL(地址欄)可以看到不安全,而post無法看見,比較安全。
get傳遞的數據量是有限的且只能傳遞文本信息,而post可以傳遞大量數據並且可以傳遞圖片、視頻等其他文件類型。
get傳輸速度比post快(這是get的唯一一個優點)
3、get使用URL傳遞數據的格式
http://URL地址.html?name1=value1&name2=value2從: “?”表示參數傳遞的開始,多個參數之間用&符號間隔,同一個參數
用name來標識value。
http://127.0.0.1:8020/025454.html?username=123&password=123
所以使用表單時,input輸入框的name屬性一定不能省略, 如果省略input的name屬性,則這個input的數據不會往后台傳遞;
接下來我們使用PHP 中的$_GET 變量和$_POST變量實現簡單的前后台數據傳輸交互功能:
form.html 文件代碼如下
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>PHP $_GET 變量和$_POST變量使用示例</title> <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script> </head> <body> <form action="03-ChaoQuanJuArray.php" method="post"> 用戶名:<input type="text" name="username" /> 密碼:<input type="password" name="pwd" /> <button id="btn1">點擊發送post請求</button> </form> <form action="03-ChaoQuanJuArray.php" method="get"> 用戶名:<input type="text" name="username" /> 密碼:<input type="password" name="pwd" /> <button id="btn2">點擊發送get請求</button> </form> </body> </html>
接下來我們新建一個PHP文件用來請求訪問和判斷,代碼如下:
if(isset($_GET["username"])&& isset($_GET["pwd"])){
if($_GET["username"]=='wq'&& $_GET["pwd"]=="123"){
echo "登陸成功!";
}else{
echo "登陸失敗!";
}
}
if(isset($_POST["username"])&& isset($_POST["pwd"])){
if($_POST["username"]=='wq'&& $_POST["pwd"]=="123"){
echo "登陸成功!";
}else{
echo "登陸失敗!";
}
}
則相應的函數觸發的JS代碼如下所示:
<script type="text/javascript"> $("#btn1").click(function(){ var username = $("input[name='username']").val(); var pwd = $("input[name='pwd']").val(); $.post("03-chaoQuanJuArray.php",{ "username":username, "pwd":pwd, },function(data){ alert(data); }) }); $("#btn2").click(function(){ var username = $("input[name='username']").val(); var pwd = $("input[name='pwd']").val(); $.get("03-chaoQuanJuArray.php",{ "username":username, "pwd":pwd, },function(data){ alert(data); }) }); </script>
!注意:在運行時確保已經搭建好了運行環境,保證服務器在線且處於運行狀態
在運行HTML文件時,記得將服務器地址端口號改為localhost以訪問本機文件:
則當我們輸入密碼,點擊第一個按鈕:點擊發送POST請求時,表單演示如下:
則當我們輸入密碼,點擊第二個按鈕:點擊發送GET請求時,表單演示如下:
在 HTML 表單中使用 method="get" 時,所有的變量名和值都會顯示在 URL 中。
注釋:所以在發送密碼或其他敏感信息時,不應該使用這個方法!
然而,正因為變量顯示在 URL 中,因此可以在收藏夾中收藏該頁面。在某些情況下,這是很有用的。
注釋:HTTP GET 方法不適合大型的變量值。它的值是不能超過 2000 個字符的。