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内容的输出,这样就要设置两者一前一后调用(而非同时调用),即要进行同步请求