博客列表 >GET与POST的区别及AJAX异步请求-2019.01.21

GET与POST的区别及AJAX异步请求-2019.01.21

大宝的博客
大宝的博客原创
2019年01月21日 16:31:36592浏览

一、GET与POST的区别  

1,http中,GET用于信息获取,而且是安全的和幂等的。

(1).所谓安全的意味着该操作用于获取信息而非修改信息。换句话说,GET 请求一般不应产生副作用。就是说,它仅仅是获取资源信息,就像数据库查询一样,不会修改,增加数据,不会影响资源的状态。

(2).幂等的意味着对同一URL的多个请求应该返回同样的结果。

2,http中,POST是用于修改服务器上的资源的请求。

说完原理性的问题,我们从表面上来看看GET和POST的区别:

(1). get是从服务器上获取数据,post是向服务器传送数据。 

get 和 post只是一种传递数据的方式,get也可以把数据传到服务器,他们的本质都是发送请求和接收结果。只是组织格式和数据量上面有差别,http协议里面有介绍

(2).get是把参数数据队列加到提交表单的ACTION属性所指的URL中,值和表单内各个字段一一对应,在URL中可以看到。post是通过HTTP post机制,将表单内各个字段与其内容放置在HTML HEADER内一起传送到ACTION属性所指的URL地址。用户看不到这个过程。 

因为get设计成传输小数据,而且最好是不修改服务器的数据,所以浏览器一般都在地址栏里面可以看到,但post一般都用来传递大数据,或比较隐私的数据,所以在地址栏看不到,能不能看到不是协议规定,是浏览器规定的。

(3).对于get方式,服务器端用Request.QueryString获取变量的值,对于post方式,服务器端用Request.Form获取提交的数据。 

(4).get传送的数据量较小,不能大于2KB。post传送的数据量较大,一般被默认为不受限制。但理论上,IIS4中最大量为80KB,IIS5中为100KB。 

post基本没有限制,我想大家都上传过文件,都是用post方式的。只不过要修改form里面的那个type参数

(5). get安全性非常低,post安全性较高。 

如果没有加密,他们安全级别都是一样的,随便一个监听器都可以把所有的数据监听到。

二、Ajax原理与应用

实例

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Ajax表单验证</title>
    <style>
    span{
        color:red;
    }
    </style>
</head>
<body>
    <h1>邮箱验证</h1>
    <form action="check.php" method="POST" id="login">
        <p>
        <label for="email">邮箱:</label>
        <input type="email" id="email" name="email"><span>*</span>
        </p>
        <button>登录</button>
        <!-- 占位符 -->
        <span  id="tips"></span>
    </form>
    <script>
        var login=document.getElementById('login');
        var email=document.getElementById('email');
        var btn=document.getElementsByTagName('button')[0];
        var tips=document.getElementById('tips');
        // ajax验证
        email.onblur=function(){
            // 创建ajax请求对象
            var request = new XMLHttpRequest()
            //请求成功后的回调处理
            request.onreadystatechange = function(){
                //状态为4,成功获取数据为200
                if(this.readyState === 4 && this.status === 200){
                    //更新提示信息
                    tips.innerHTML=this.responseText
                }
            }
            //设置请求参数
            request.open('POST','check.php',true)
            //设置请求头信息
            request.setRequestHeader('content-type','application/x-www-form-urlencoded')
            //发送请求
            request.send('email='+email.value)
        }
        email.oninput = function () {
             tips.innerHTML = '';
        }
        btn.onclick = function () {
                if (email.value.length > 0) {
                    tips.innerHTML = '登录成功,正在跳转...';
                    setTimeout(function (){
                        location.href = 'admin/index.php';
                    }, 2000);
                } else {
                    tips.innerHTML = '邮箱不能为空';
                }
            return false;
         }
    </script>
</body>
</html>

运行实例 »

点击 "运行实例" 按钮查看在线实例

check.php

<?php
$email = empty($_POST['email']) ? '' : $_POST['email'];
$emailList = ['admin@php.cn', 'peter@php.cn'];
if (empty($email)) {
echo '邮箱不能为空';
} elseif (!in_array($email, $emailList)) {
echo '新用户,请先注册 >注册</a>';
}


声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议