1.给服务器传递数据量
get传递较小,受限于浏览器
post原则没有限制
2.安全方面
post传递数据较安全
3.传递数据的形式不一样
get方式在url地址后边以请求字符串形式传递参数
http://网址/index.php?name=tom&age=23&addr=beijing
蓝色部分就是请求字符串,就是一些“名-值”对,中间使用&符号连接
post方式是把form表单的数据给请求出来以xml形式传递给服务器
一、get请求注意事项:
火狐浏览器会把传递的“中文”get参数信息给自动编码处理,但IE浏览器不会
ajax之get请求需要注意的两个地方:
1。在url地址后边以请求字符串(传递的get参数信息)形式传递数据
2.对中文、=、&等特殊符号处理
对特殊信息的处理:
在浏览器里通过get参数传递一些特殊符号信息会被误解混淆,例如& =等。为了避免特殊符号被误解产生歧义,需要对其进行编码处理。
1.在php里边可以函数urlencode()/urldecode()对特殊符号进行编码,反编码处理(url_encode()可以把中文转变为浏览器可以识别的信息。编码后的信息为%号后接两个十六进制数)
2.在javascript里边可以通过encodeURLComponent()对特殊符号等信息进行编码。
(编码后的信息可以被正常接收使用,无需反编码。)
具体可以被编码的特殊符号:
(encodeURLComponent编码)
字符 特殊字符的含义URL编码
# 用来标志特定的文档位置%23
% 对特殊字符进行编码%25
& 分隔不同的变量值对%26
+ 在变量值中表示空格%2B
\ 表示目录路径%2F
= 用来连接键和值%3D
? 表示查询字符串的开始%3F
汉字的每个字节单位转为为%两个十六进制数
【php代码(03.php)】
<?php
//接收get方式传递过来的“用户名”信息,并做数据库校验
print_r($_GET);
//连接数据库、通过sql语句验证
【php代码(04.php)】
1 <?php 2 3 $subject="php&detail=html"; 4 5 $subject=urlencode($subject); 6 7 echo "<a href='./03.php?sjt=$subject'>php0609</a>";
【html代码】
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5 <title>无标题文档</title> 6 <script type="text/javascript"> 7 function checkname(){ 8 //ajax方式用户名校验 9 //1.获取用户名信息 10 var nm=document.getElementById('username').value; 11 12 //对传递的特殊符号(例如&、=等)进行编码处理 13 //同时对“中文”也会进行编码处理 14 nm=encodeURIComponent(nm); 15 16 //2.ajax校验 17 var hh=new XMLHttpRequest(); 18 //ajax事件设置,以便接收返回的信息 19 hh.onreadystatechange=function(){ 20 if(hh.readyState==4){ 21 alert(hh.responseText); 22 } 23 } 24 hh.open('GET','./03.php?name='+nm+'&addr=beijing'); 25 hh.send(null); 26 } 27 28 </script> 29 </head> 30 31 <body> 32 <h2>ajax之用户名的校验(get方式)</h2> 33 <p>用户名:<input type="text" id="username" onblur="checkname()" /></p> 34 <p>手机号码:<input type="text" id="usertel" /></p> 35 36 </body> 37 </html>
二、post请求注意事项:
ajax之get请求需要注意的四个地方:
1.给服务器传递数据需要调用send(请求字符串数据)方法
2.调用setRequestHeader()把传递的数据组织为xml格式(模仿form表单传递数据)
3.传递的中文信息无需编码,特殊符号像&、=等,仍需编码
4.该方式请求的同时也可以传递get参数信息,同样适用$_GET接收该信息
(该代码有问题未解决)
【php代码】
1 <?php 2 3 //接收post方式传递过来的“用户名”信息,并做数据库校验 4 echo "post:"; 5 print_r($_POST); 6 7 echo "get:"; 8 print_r($_GET); 9 10 //连接数据库、通过sql语句验证
【html代码】
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5 <title>无标题文档</title> 6 <script type="text/javascript"> 7 function checkname(){ 8 //ajax方式用户名校验 9 //1.获取用户名信息 10 var nm=document.getElementById('username').value; 11 12 //对传递的特殊符号(例如&、=等)进行编码处理 13 //同时对“中文”也会进行编码处理 14 nm=encodeURIComponent(nm); 15 16 //把用户名信息变为“请求字符串” 17 var info = "name"+nm+"&addr=beijing"; 18 //2.ajax校验 19 var hh=new XMLHttpRequest(); 20 //ajax事件设置,以便接收返回的信息 21 hh.onreadystatechange=function(){ 22 if(hh.readyState==4){ 23 alert(hh.responseText); 24 } 25 } 26 hh.open('post','./03.php?color=red'); 27 //post方式传递数据时模拟form表单传递数据 28 //form表单的post格式数据时通过xml形式传递给服务器的 29 hh.setRequestHeader("content-type","application/x-www-form-urlencoded"); 30 31 hh.send(info); 32 } 33 34 </script> 35 </head> 36 37 <body> 38 <h2>ajax之用户名的校验(post方式)</h2> 39 <p>用户名:<input type="text" id="username" onblur="checkname()" /></p> 40 <p>手机号码:<input type="text" id="usertel" /></p> 41 42 </body> 43 </html>
出现问题:
经过一天的问题查找,发现是一个小细节错误:
应改为: var info="name="+nm+"&addr=beijing"; //少了一个等号
同步请求和异步请求:
ajax对象.open(方式get/post,url地址,【异步true】【同步false】);
ajax是可以与服务器进行(异步或同步)交互的技术之一。
异步:同一个时间点允许执行多个进程(内容同时显示)
同步:同一个时间点只允许执行一个进程(内容显示有先后顺序)
什么时候使用同步请求:
ajax绝大多数情况下进行异步请求,但是有的时候也要使用“同步请求”(其不能被取代)
例如页面有两部分内容,ajax请求内容和正常的html内容输出,如果html的输出内容包括ajax请求的内容,就需要使得ajax请求完成了再进行html内容的输出,这样就要设置两者一前一后调用(而非同时调用),即要进行同步请求