前言

我们经常会用到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请求的更多相关文章

  1. 原生js发送ajax请求

    堕落了一阵子了,今天打开博客,发现连登录的用户名和密码都不记得了.2016年已过半,不能再这么晃荡下去了. 参加了网易微专业-前端攻城狮 培训,目前进行到大作业开发阶段,感觉举步维艰.但是无论如何,不 ...

  2. 从零开始学习Node.js例子七 发送HTTP客户端请求并显示响应结果

    wget.js:发送HTTP客户端请求并显示响应的各种结果 options对象描述了将要发出的请求.data事件在数据到达时被触发,error事件在发生错误时被触发.HTTP请求中的数据格式通过MIM ...

  3. Node.js 0.12: 正确发送HTTP POST请求

    Node.js 0.12: 正确发送HTTP POST请求 本文针对版本:Node.js 0.12.4 之前写过一篇Node.js发送和接收HTTP的GET请求的文章,今天再写一篇,讲发送POST的请 ...

  4. js 发送异步请求

    js用XMLHttpRequest发送异步请求 发送GET请求 var xhr = new XMLHttpRequest(); xhr.open('GET',url);//url为请求地址 xhr.r ...

  5. 前端必备基础知识之--------原生JS发送Ajax请求

    原生JS发送Ajax请求 ajax({ type: 'POST', url: 'http://10.110.120.123:2222', // data: param, contentType: 'a ...

  6. 纯js异步无刷新请求(只支持IE)

    纯js异步无刷新请求 下载地址:http://pan.baidu.com/s/1slakL1F 所以因为非IE浏览器都禁止跨域请求,所以以只支持IE. <HTML> <!-- 乱码( ...

  7. Fiddler 使用fiddler发送捕获的请求及模拟服务器返回

    使用fiddler发送捕获的请求及模拟服务器返回 by:授客 QQ:1033553122 1.做好相关监听及代理设置 略 2.发送捕获的请求 如图 3.模拟服务器返回 本例的一个目的是,根据服务器返回 ...

  8. 纯js异步无刷新请求(只支持IE)【原】

    纯js异步无刷新请求 下载地址:http://pan.baidu.com/s/1slakL1F 所以因为非IE浏览器都禁止跨域请求,所以以只支持IE. <HTML> <!-- 乱码( ...

  9. js多个异步请求,按顺序执行next

    在js里面,偶尔会遇见需要多个异步按照顺序执行请求,又不想多层嵌套,,这里和promise.all的区别在于,promise或者Jquery里面的$.when 是同时发送多个请求,一起返回,发出去的顺 ...

  10. js多个异步请求

    一,两个(或多个)js异步并发执行,怎么在两个AJax异步操作之后执行一个新的操作 原题来自 ES6 方法 1.Promise 包装异步ajax操作,2.定义async 函数,3.用await等待pr ...

随机推荐

  1. Qt编写音频播放示例(带音频曲线/振幅/传输/录制等)

    一.功能特点 自动计算音频振幅,绘制音频振幅曲线和音频数据曲线. 支持音频录制,可选音频输入设备.采样频率.通道等参数,Qt5默认保存wav格式,Qt6默认保存mp3格式,Qt6可选wma.aac等格 ...

  2. Qt编写地图综合应用11-动态添加

    一.前言 在添加设备点或者区域形状的时候,会考虑是直接静态的方式写入到网页中加载,还是动态js函数异步加载的方式,这个需要根据现场的实际需求来,如果只需要一次加载的话建议静态即可,如果运行期间还需要动 ...

  3. 解决Failed to load module canberra-gtk-module错误

    在Ubuntu环境里,通过./triangulation 1.png 2.png 命令运行高翔的ch7的triangulation程序时报错: Gtk-Message: 09:10:26.571: F ...

  4. Visual Studio Code启动时总是提示“Code安装似乎损坏。请重新安装。”、标题栏显示“不受支持”等信息的解决办法

    我的VSCode一直提示"Code安装似乎损坏.请重新安装."同时标题栏显示"不受支持"就像这样: 反思了一下,应该是我安装的background插件,把vsc ...

  5. 《jQueryEasyUI从零开始学》-施尧2018一书的配套源代码和学习资源

    <jQueryEasyUI从零开始学>-施尧2018一书的配套源代码和学习资源:下载地址 提取码:uuly

  6. Redis 源码简洁剖析 08 - epoll

    select, poll, epoll 源码分析 参考链接 Redis 源码简洁剖析系列 select, poll, epoll 关于 select, poll, epoll,​网络 IO 演变发展过 ...

  7. VSTO踩坑记录(2)- 运用outlook对象模型发送邮件

    概述 上篇文章记录了怎么样让vsto插件显示在功能区上面,这篇文章来说说怎么运用微软提供的对象方法对outlook进行操作,附上官方文档. 这次示例我们来用代码发一封邮件,先简单拉几个控件,分别代表要 ...

  8. 创建企业级地理数据库——PostgreSQL版

    创建PostgreSQL空间数据库 填写相应的参数,选择授权文件 报错 默认安装postgresql后,执行以上操作报错 "You must copy the latest ST_GEOME ...

  9. Mac配置apache cgi服务

    CGI(Common Gateway Interface),通用网关接口,它是一段程序,运行在服务器上如:HTTP服务器,提供同客户端HTML页面的接口 Mac上是自带CGI运行程序的,但是直接是不可 ...

  10. Java多进程多线程处理详解

    在Java编程中,多进程和多线程是两种常见的并发编程技术,用于提高程序的执行效率和响应速度.本文将详细介绍Java中的多进程和多线程处理,包括理论概述和代码示例.通过本文,你将了解如何在Java中实现 ...