js发送get 、post请求
前言
我们经常会用到js发送网络请求,这里用到XMLHttpRequest,主要是为了考虑早期的IE。分为三步:创建需要的对象、连接和发送、接收。
GET请求
var httpRequest = new XMLHttpRequest();//第一步:建立所需的对象
httpRequest.open('GET', 'url', true);//第二步:打开连接 将请求参数写在url中 ps:"./Ptest.php?name=test&nameone=testone"
httpRequest.send();//第三步:发送请求 将请求参数写在URL中
/**
* 获取数据后的处理程序
*/
httpRequest.onreadystatechange = function () {
if (httpRequest.readyState == 4 && httpRequest.status == 200) {
var json = httpRequest.responseText;//获取到json字符串,还需解析
console.log(json);
}
};
POST请求
var httpRequest = new XMLHttpRequest();//第一步:创建需要的对象
httpRequest.open('POST', 'url', true); //第二步:打开连接
httpRequest.setRequestHeader("Content-type","application/x-www-form-urlencoded");//设置请求头 注:post方式必须设置请求头(在建立连接后设置请求头)
httpRequest.send('name=teswe&ee=ef');//发送请求 将情头体写在send中
/**
* 获取数据后的处理程序
*/
httpRequest.onreadystatechange = function () {//请求后的回调接口,可将请求成功后要执行的程序写在其中
if (httpRequest.readyState == 4 && httpRequest.status == 200) {//验证请求是否发送成功
var json = httpRequest.responseText;//获取到服务端返回的数据
console.log(json);
}
};
post方式发送json
var httpRequest = new XMLHttpRequest();//第一步:创建需要的对象
httpRequest.open('POST', 'url', true); //第二步:打开连接/***发送json格式文件必须设置请求头 ;如下 - */
httpRequest.setRequestHeader("Content-type","application/json");//设置请求头 注:post方式必须设置请求头(在建立连接后设置请求头)var obj = { name: 'zhansgan', age: 18 };
httpRequest.send(JSON.stringify(obj));//发送请求 将json写入send中
/**
* 获取数据后的处理程序
*/
httpRequest.onreadystatechange = function () {//请求后的回调接口,可将请求成功后要执行的程序写在其中
if (httpRequest.readyState == 4 && httpRequest.status == 200) {//验证请求是否发送成功
var json = httpRequest.responseText;//获取到服务端返回的数据
console.log(json);
}
};
js发送get 、post请求的更多相关文章
- 原生js发送ajax请求
堕落了一阵子了,今天打开博客,发现连登录的用户名和密码都不记得了.2016年已过半,不能再这么晃荡下去了. 参加了网易微专业-前端攻城狮 培训,目前进行到大作业开发阶段,感觉举步维艰.但是无论如何,不 ...
- 从零开始学习Node.js例子七 发送HTTP客户端请求并显示响应结果
wget.js:发送HTTP客户端请求并显示响应的各种结果 options对象描述了将要发出的请求.data事件在数据到达时被触发,error事件在发生错误时被触发.HTTP请求中的数据格式通过MIM ...
- Node.js 0.12: 正确发送HTTP POST请求
Node.js 0.12: 正确发送HTTP POST请求 本文针对版本:Node.js 0.12.4 之前写过一篇Node.js发送和接收HTTP的GET请求的文章,今天再写一篇,讲发送POST的请 ...
- js 发送异步请求
js用XMLHttpRequest发送异步请求 发送GET请求 var xhr = new XMLHttpRequest(); xhr.open('GET',url);//url为请求地址 xhr.r ...
- 前端必备基础知识之--------原生JS发送Ajax请求
原生JS发送Ajax请求 ajax({ type: 'POST', url: 'http://10.110.120.123:2222', // data: param, contentType: 'a ...
- 纯js异步无刷新请求(只支持IE)
纯js异步无刷新请求 下载地址:http://pan.baidu.com/s/1slakL1F 所以因为非IE浏览器都禁止跨域请求,所以以只支持IE. <HTML> <!-- 乱码( ...
- Fiddler 使用fiddler发送捕获的请求及模拟服务器返回
使用fiddler发送捕获的请求及模拟服务器返回 by:授客 QQ:1033553122 1.做好相关监听及代理设置 略 2.发送捕获的请求 如图 3.模拟服务器返回 本例的一个目的是,根据服务器返回 ...
- 纯js异步无刷新请求(只支持IE)【原】
纯js异步无刷新请求 下载地址:http://pan.baidu.com/s/1slakL1F 所以因为非IE浏览器都禁止跨域请求,所以以只支持IE. <HTML> <!-- 乱码( ...
- js多个异步请求,按顺序执行next
在js里面,偶尔会遇见需要多个异步按照顺序执行请求,又不想多层嵌套,,这里和promise.all的区别在于,promise或者Jquery里面的$.when 是同时发送多个请求,一起返回,发出去的顺 ...
- js多个异步请求
一,两个(或多个)js异步并发执行,怎么在两个AJax异步操作之后执行一个新的操作 原题来自 ES6 方法 1.Promise 包装异步ajax操作,2.定义async 函数,3.用await等待pr ...
随机推荐
- uniapp同城社区交友 仿小红书 APP小程序源码 含后台管理和网页端
注意(预防被骗) 本程序仅在 破晓店铺(https://shop.abyssdawn.com/).破晓一代网络科技淘宝店 出售其余地方均为骗子. 关于本程序 本程序适用于各种同城社区交友类产品,例如同 ...
- JSON解析的这6种方案,真香!
前言 在 Java 开发中,解析 JSON 是一个非常常见的需求. 不管是和前端交互.调用第三方接口,还是处理配置文件,几乎都绕不开 JSON. 这篇文章总结了6种主流的 JSON 解析方法,希望对你 ...
- 探索Python @dataclass的内部原理
之前写过一篇介绍Python中dataclass的文章:<掌握python的dataclass,让你的代码更简洁优雅>. 那篇侧重于介绍dataclass的使用,今天想探索一下这个有趣的特 ...
- 最全Zookeeper面试题总结
1. ZooKeeper 是什么? ZooKeeper 是一个开源的分布式协调服务.它是一个为分布式应用提供一致性服务的软件,分布式应用程序可以基于 Zookeeper 实现诸如数据发布/订阅.负载均 ...
- w3cschool-OpenResty 最佳实践Library
https://www.w3cschool.cn/openresty1/ OpenResty LRR 访问有授权验证的 Redis 2.不重启Redis设置密码: 在配置文件中配置requirepas ...
- w3cschool-Flink 入门
Flink 入门 Apache Flink是一个框架和分布式处理引擎,用于在无界和有界数据流上进行有状态的计算.Flink被设计为在所有常见的集群环境中运行,以内存中的速度和任何规模执行计算. A ...
- biancheng-Thymeleaf教程
Thymeleaf 是一款用于渲染 XML/XHTML/HTML5 内容的模板引擎.它与 JSP,Velocity,FreeMaker 等模板引擎类似,也可以轻易地与 Spring MVC 等 Web ...
- atomikos实现分布式事务
date: 2022-04-25 categories: [java, 编程] tags: [分布式事务] 概述 多数据源单服务写入, 分布式事务实现 使用随机数控制产生异常 注: 网上很多都是只有多 ...
- SQL SERVER巡检脚本
print'----------------------------' print'开始巡检' print'----------------------------' print'1.查看数据库版本信 ...
- ISA-L库调研
本文分享自天翼云开发者社区<ISA-L库调研>,作者:何****尔 1.Intel SIMD指令集 SIMD(single instruction multiple data)单指令多数据 ...