详细解析Ajax的使用之向服务器发送GET请求

简介: 详细解析Ajax的使用之向服务器发送GET请求上篇文章讲的如何使用Ajax发送get请求,这篇文章说如何使用Ajax发送post请求。HTML代码: <h1>ajax的post请求</h1> <button id="btn">发送请求</button> 1 2JavaScript代码: var oBtn = document.getElementById("btn"); // 1.初始化请求对象 var xhr; if (window.XMLHttpRequest) { xhr = new XML

详细解析Ajax的使用之向服务器发送GET请求




上篇文章讲的如何使用Ajax发送get请求,这篇文章说如何使用Ajax发送post请求。

HTML代码:

<h1>ajax的post请求</h1><buttonid="btn">发送请求</button>

JavaScript代码:


varoBtn=document.getElementById("btn");
// 1.初始化请求对象varxhr;
if (window.XMLHttpRequest) {
xhr=newXMLHttpRequest();
console.log(xhr.readyState);
    } else {
xhr=newActiveXObject("Microsoft.XMLHTTP");
    }
// 2.发送请求   // 2-1.设置请求的方式 地址等xhr.open("POST", "post.php", true);
console.log(xhr.readyState);
// 2-2.设置请求头xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
// 2-3.发送请求xhr.send("user=zhangsan&psw=654321");
console.log(xhr.readyState);
xhr.onreadystatechange=function () {
oBtn.onclick=function () {
console.log(xhr.readyState);
if (xhr.readyState==4&&xhr.status==200) {    
console.log(xhr.responseText);
            }
        }
    }

PHP代码:


<?php$user=$_POST["user"];
$psw=$_POST["psw"];
echo"用户名:{$user},密码:{$psw}";
?>


总结: post请求主要是向服务器发送数据,发送的数据也不会拼接在URL后面,安全性较高,而且允许的数据大小比较大。


视频讲解链接:
https://www.bilibili.com/video/BV1Lt4y1y7Ae/

相关文章
|
4天前
|
存储 缓存 安全
第二章 HTTP请求方法、状态码详解与缓存机制解析
第二章 HTTP请求方法、状态码详解与缓存机制解析
|
4天前
|
Web App开发 存储 缓存
第八篇 提升网页性能:深入解析HTTP请求优化策略(三)
第八篇 提升网页性能:深入解析HTTP请求优化策略(三)
|
4天前
|
消息中间件 前端开发 JavaScript
第七篇 提升网页性能:深入解析HTTP请求优化策略(二)
第七篇 提升网页性能:深入解析HTTP请求优化策略(二)
|
20小时前
|
存储 弹性计算 监控
【阿里云弹性计算】阿里云ECS全面解析:弹性计算服务的核心优势与应用场景
【5月更文挑战第20天】阿里云ECS是提供可伸缩计算能力的云服务,支持多种规格实例,满足不同需求。其核心优势包括灵活性、高性能、高可用性、安全性和易用性。适用场景包括网站托管、大数据处理、游戏多媒体应用及测试开发环境。通过Python示例代码展示了如何创建ECS实例,助力企业专注业务发展,简化基础设施管理。
23 5
|
3天前
|
自然语言处理 负载均衡 监控
处理HTTP请求的服务器
处理HTTP请求的服务器
11 1
|
4天前
|
编解码 前端开发 JavaScript
第六篇 提升网页性能:深入解析HTTP请求优化策略(一)
第六篇 提升网页性能:深入解析HTTP请求优化策略(一)
|
5天前
|
JSON JavaScript API
使用 Node.js 开发一个简单的 web 服务器响应 HTTP post 请求
使用 Node.js 开发一个简单的 web 服务器响应 HTTP post 请求
13 1
|
5天前
|
JSON JavaScript 中间件
使用 Node.js 开发一个简单的 web 服务器响应 HTTP get 请求
使用 Node.js 开发一个简单的 web 服务器响应 HTTP get 请求
10 2
|
5天前
|
存储 JSON JavaScript
Node.js 上开发一个 HTTP 服务器,监听某个端口,接收 HTTP POST 请求并处理传入的数据
Node.js 上开发一个 HTTP 服务器,监听某个端口,接收 HTTP POST 请求并处理传入的数据
13 0
|
5天前
|
JSON 数据格式 开发者
【公众号开发】Access Token的获取 · 请求公众号服务器创建自定义菜单 · 处理自定义菜单按钮事件(下)
【公众号开发】Access Token的获取 · 请求公众号服务器创建自定义菜单 · 处理自定义菜单按钮事件
12 0

推荐镜像

更多