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

本文涉及的产品
公共DNS(含HTTPDNS解析),每月1000万次HTTP解析
云解析 DNS,旗舰版 1个月
全局流量管理 GTM,标准版 1个月
简介: 详细解析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/

相关文章
|
16天前
|
JSON JavaScript 前端开发
《进阶篇第6章:vue中的ajax》包括回顾发送ajax请求方式、vue-cli脚手架配置代理服务器、vue-resource
《进阶篇第6章:vue中的ajax》包括回顾发送ajax请求方式、vue-cli脚手架配置代理服务器、vue-resource
53 22
|
6天前
|
存储 弹性计算 NoSQL
"从入门到实践,全方位解析云服务器ECS的秘密——手把手教你轻松驾驭阿里云的强大计算力!"
【10月更文挑战第23天】云服务器ECS(Elastic Compute Service)是阿里云提供的基础云计算服务,允许用户在云端租用和管理虚拟服务器。ECS具有弹性伸缩、按需付费、简单易用等特点,适用于网站托管、数据库部署、大数据分析等多种场景。本文介绍ECS的基本概念、使用场景及快速上手指南。
31 3
|
10天前
|
监控 网络协议 安全
DNS服务器故障不容小觑,从应急视角谈DNS架构
DNS服务器故障不容小觑,从应急视角谈DNS架构
31 4
|
16天前
|
前端开发 JavaScript Java
第6章:Vue中的ajax(包含:回顾发送ajax请求方式、vue-cli脚手架配置代理服务器)
第6章:Vue中的ajax(包含:回顾发送ajax请求方式、vue-cli脚手架配置代理服务器)
46 4
|
16天前
|
存储 固态存储 安全
阿里云服务器X86计算架构解析与X86计算架构云服务器收费价格参考
阿里云服务器架构分为X86计算、Arm计算、高性能计算等多种架构,其中X86计算是用户选择最多的一种架构,本文将深入探讨阿里云X86计算架构的云服务器,包括其技术特性、适用场景、性能优势以及最新价格情况。
|
17天前
|
域名解析 网络协议 CDN
阿里云服务器购买后如何解析域名,三步操作即可解析绑定
阿里云服务器购买后如何解析域名,三步操作即可解析绑定
|
17天前
|
编解码 弹性计算 应用服务中间件
阿里云服务器Arm计算架构解析:Arm计算架构云服务器租用收费标准价格参考
阿里云服务器架构分为X86计算、Arm计算、高性能计算等多种架构,其中Arm计算架构以其低功耗、高效率的特点受到广泛关注。本文将深入解析阿里云Arm计算架构云服务器的技术特点、适用场景以及包年包月与按量付费的收费标准与最新活动价格情况,以供选择参考。
|
27天前
|
弹性计算 网络协议 Ubuntu
如何在阿里云国际版Linux云服务器中自定义配置DNS
如何在阿里云国际版Linux云服务器中自定义配置DNS
ly~
|
29天前
|
网络协议 应用服务中间件 Apache
如何在 DNS 记录中设置反向代理服务器?
要设置反向代理服务器,首先需安装配置软件(如 Nginx 或 Apache),并确保域名正确指向服务器 IP。接着,在 DNS 中设置 A 或 CNAME 记录,将域名指向反向代理服务器。然后编辑 Nginx 或 Apache 的配置文件,将请求转发至后端服务器。最后,通过浏览器访问域名测试配置是否成功,并使用工具检查请求流向和响应情况。
ly~
79 3
ly~
|
29天前
|
域名解析 网络协议 Linux
如何测试 DNS 记录中的反向代理服务器是否生效?
本文介绍了三种测试反向代理服务器配置的方法。首先,通过命令行工具如 `ping`、`nslookup` 和 `dig` 检查域名解析是否指向正确的 IP 地址。其次,利用 Web 浏览器访问域名,验证页面加载正常且请求头信息无误。最后,借助网络抓包工具如 `Wireshark` 和 `tcpdump` 分析数据包,确保请求正确转发并返回预期响应。
ly~
68 2

热门文章

最新文章

推荐镜像

更多