请求方式 get、post、delete、options、put等 经常在code中出现的是get post两种 get 请求： 1、传送的数据量较小（相对于post而言）。参数要放在url中，但url长度是有限制的【不同的浏览器长度不一样】，不是无限的，所以get传送的数据量不能超过2KB。 2、安全性非常低，因为参数暴露url中，而且get请求会被浏览器缓存起来。，你懂的 3、执行效率却比post要快。因为tcp协议 4、get请求的是静态资源，则会缓存，如果是数据，则不会缓存【并不是所有浏览器都会缓存的】
post请求： 1、传送的数据量较大，一般被默认认为不受限制的，但理论上，IIS4中最大量：80KB，IIS5中：100KB 2、安全性较高，因为参数是放在请求体中的。 3、执行效率比get慢些。 4、post将参数放在header内，用户看不到这个过程， 5、post请求要加请求头一般 content-type ： application/x-www-form-urlencode 6、不会被缓存、保存在服务器日志、以及浏览器浏览记录中 7.post会有浏览器提示重新提交表单的问题【用普通的http协议提交会有，ajax等没有的】，get没有。
post能发送更多的数据类型（get只能发送ASCII字符
post在真正接受数据之前会先将请求头发送给服务器进行确认，然后才真正发送数据。（小部队先探路，安全可靠，大部队在通过） post请求过程： 1、浏览器请求tcp连接（第一次握手） 2、服务器应答进行tcp连接（第二次握手） 3、浏览器确认，并发送post请求头（第三次握手，这个报文比较小【小部队】，所以http会在此时进行第一次数据发送） 4、服务器返回100 continue 响应 4、浏览器开始发送数据 6、服务器返回200 ok 响应
get请求过程： 1、浏览器请求tcp连接（第一次握手） 2、服务器应答进行tcp连接（第二次握手） 3、浏览器确认，并发送get请求头和数据（第三次握手，这个报文比较小，所以http会在此时进行第一次数据发送） 4、服务器返回200 Ok 响应
目测get的总耗是post的2/3左右
get请求产生一个TCP数据包；post请求产生两个TCP数据包（get请求，浏览器会把http header和data一并发送出去，服务器响应200返回数据；post请求，浏览器先发送header，服务器响应100 continue，浏览器再发送data，服务器响应200 返回数据）
function sendPost(){
var xhr=null;
if(window.XMLHttpRequest){
// IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
xhr=new XMLHttpRequest()
}else{
//IE6、IE5
xhr=new ActiveXOject("Microsoft.XMLHTTP")
}
xhr.setRequestHeader('content-type','application/x-www-form-urlencoded')
xhr.onreadstatechange=function(){
//0：请求未初始化
//1：请求建立
//2：请求已接受
//3：请求处理中
//4：请求结束
if(xhr.readyState==4){
if(xhr.status==200){
console.log(xhr.responseText)
}else{
console.log('请求失败')
}
}
}
// xhr.get('post','xxxxxxx?userName=Ares_Wang&address=苏州','是否异步')
xhr.open('post','请求的url','是否异步')
xhr.send("userName=Ares_Wang&address=苏州")
}
url 编码、解码
encodeURI('http://www.baidu.com?username=我是Ares——Wang')
decodeURI('http://www.baidu.com?username=%E6%88%91%E6%98%AFAres%E2%80%94%E2%80%94Wang')
http 缓存的条件 1、使用get请求 2、请求url地址固定 3、IE低版本浏览器
只有任意一条不满足 就不会产生缓存，通常采取第二个 url地址不固定 加上时间戳。
//创建XHR对象
function createXHR(){
if(typeof XMLHttpRequest !='undefined'){
return new XMLHttpRequest()
}else if(typeof ActiveXObject !='undefined'){
return new ActiveXObject('Microsoft.XMLHTTP')
}else{
throw new Error('浏览器不支持创建XMLHttpRequest 对象')
}
}
//名值对转换字符串
function params(data){
var temp=[]
for (var key in data) {
temp.push(encodeURIComponent(key)+'='+encodeURIComponent(data[key]))
}
return temp.join('&')
}
//封装Ajax
function ajax(obj){
const xhr=createXHR()
obj.url=obj.url+'?timestamp='+(new Date()).getTime()
obj.data=params(obj.data)
if(obj.method==='get'){
obj.url+='&'+obj.data;
}
if(obj.async===true){
xhr.onreadystatechange=function(){
if(xhr.readyState==4){
callback()
}
}
}
xhr.open(obj.method,obj.url,obj.async)
if(obj.method==='post'){
xhr.setRequestHeader('Content-Type','application/x-www-from-urlencodeed')
xhr.send(obj.data)
}else{
xhr.send(null)
}
if(obj.async===false){
callback()
}
function callback(){
if(xhr.status===200){
obj.success(xhr.responseText) //回调传递参数
}else{
//alert('获取数据错误！错误代号：'+xhr.status+',错误信息'+xhr.statusText)
obj.error('获取数据错误！错误代号：'+xhr.status+',错误信息'+xhr.statusText);
}
}
}
/*
调用ajax
ajax({
method:'post',
url: 'http://xxxx',
data:{
'name':'xxx',
'age':20
},
success:functon(text){
alert(text)
},
error:function(text){
alert(text)
},
async:true
})
*/
利用闭包封装在一个函数中
//创建XHR对象
// function createXHR(){
// if(typeof XMLHttpRequest !='undefined'){
// return new XMLHttpRequest()
// }else if(typeof ActiveXObject !='undefined'){
// return new ActiveXObject('Microsoft.XMLHTTP')
// }else{
// throw new Error('浏览器不支持创建XMLHttpRequest 对象')
// }
// }
//名值对转换字符串
// function params(data){
// var temp=[]
// for (var key in data) {
// temp.push(encodeURIComponent(key)+'='+encodeURIComponent(data[key]))
// }
// return temp.join('&')
// }
//封装Ajax
function ajax(obj){
const xhr=(
function createXHR(){
if(typeof XMLHttpRequest !='undefined'){
return new XMLHttpRequest()
}else if(typeof ActiveXObject !='undefined'){
return new ActiveXObject('Microsoft.XMLHTTP')
}else{
throw new Error('浏览器不支持创建XMLHttpRequest 对象')
}
}
)()
obj.url=obj.url+'?timestamp='+(new Date()).getTime()
//obj.data=params(obj.data)
obj.data=(function(data){
var temp=[]
for (var key in data) {
temp.push(encodeURIComponent(key)+'='+encodeURIComponent(data[key]))
}
return temp.join('&')
})(obj.data)
if(obj.method==='get'){
obj.url+='&'+obj.data;
}
if(obj.async===true){
xhr.onreadystatechange=function(){
if(xhr.readyState==4){
callback()
}
}
}
xhr.open(obj.method,obj.url,obj.async)
if(obj.method==='post'){
xhr.setRequestHeader('Content-Type','application/x-www-from-urlencodeed')
xhr.send(obj.data)
}else{
xhr.send(null)
}
if(obj.async===false){
callback()
}
function callback(){
if(xhr.status===200){
obj.success(xhr.responseText) //回调传递参数
}else{
//alert('获取数据错误！错误代号：'+xhr.status+',错误信息'+xhr.statusText)
obj.error('获取数据错误！错误代号：'+xhr.status+',错误信息'+xhr.statusText);
}
}
}
/*
调用ajax
ajax({
method:'post',
url: 'http://xxxx',
data:{
'name':'xxx',
'age':20
},
success:functon(text){
alert(text)
},
error:function(text){
alert(text)
},
async:true
})
*/
//from :from 表单 function serialize(from){ var parts=[] for(var i=0;i ASP.NET 的默认提交方式： POST HTML 的默认提交方式： GET 相关链接
发表评论