egret php交互,egret 发送HTTP请求
在 Egret 项目中,通常会遇到与后端服务器进行数据交互的情况。Egret 中封装了 XMLHttpRequest 来进行异步的数据交互。
HTTP请求
通过 HTTP 协议可以实现 HTTP 客户端(如web浏览器)向 HTTP 服务端请求信息和服务。目前的 HTTP 1.1 协议是一种无状态协议,也就是说 HTTP 客户端和 HTTP 服务端不能保持持久的链接,使用请求/应答的模式来工作,如果客户端向服务端发送信息,服务端做出应答之后将关闭链接,来形成一套请求和应答。
基本过程
HTTP 通信机制都要经过如下的几个步骤:
建立TCP连接.
Web浏览器向Web服务器发送请求命令.
Web浏览器发送请求头信息
Web服务器应答
Web服务器发送应答头信息
Web服务器向浏览器发送数据
Web服务器关闭TCP连接(如果请求头部设置了Connection:keep-alive将保持连接状态仍然打开).
HTTP 请求方法
GET 方法
GET 方法是 HTTP 请求的默认方法,数据经过简单的编码发送出去,并作为 URL 的一部分发送到服务器。由于浏览器对 URL 长度的限制,提交的 数据长度也有限制。
POST 方法
POST 方法克服了 GET 方法的一些缺点,可以发送较大的数据.数据也不再是明文发送的。出于安全的考虑一般选用 POST 方法。 POST 提交的数据也可以从标准输入输出流中获取。
发送请求
在测试发送请求之前先要有一个稳定的服务端进行测试,我们可以使用httpbin.org提供的http://httpbin.org/get和http://httpbin.org/post这两个稳定的服务器地址来测试发送请求。其中get会返回 GET 请求的数据,post会返回 POST 请求发送的数据。
Egret 使用HttpRequest类发送 HTTP 请求。可以指定请求的方法为 GET 或者 POST 。可以通过监听加载事件来检测服务器端的响应。使用 HttpRequest 来发送请求的过程如下:
实例化一个 HttpRequest 对象。
设置它的响应类型responseType。
通过open方法初始化请求一个对象,初始化请求地址和请求类型。
通过setRequestHeader设置请求头信息。如果是POST带参数的请求这一步很重要,需要告诉服务端请求的参数格式,而且这一步需要在open之后执行。
通过send方法发送请求,如果是post方法可以传入参数。
添加监听,监听服务器端的响应,包括进度事件和请求成功和失败事件。
下面可以具体看一段下代码:
var request = new egret.HttpRequest();
request.responseType = egret.HttpResponseType.TEXT;
request.open("http://httpbin.org/get",egret.HttpMethod.GET);
request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
request.send();
request.addEventListener(egret.Event.COMPLETE,this.onGetComplete,this);
request.addEventListener(egret.IOErrorEvent.IO_ERROR,this.onGetIOError,this);
request.addEventListener(egret.ProgressEvent.PROGRESS,this.onGetProgress,this);
上面发送了一个 GET 请求到http://httpbin.org/get,然后需要我们添加回调事件,当请求成功或者失败之后来获取数据。
通过COMPLETE事件的response属性来获取到返回的信息。通过 ProgressEvent 事件的bytesLoaded和bytesTotal来获取到加载进度。下面添加回调函数:
private onGetComplete(event:egret.Event):void {
var request = event.currentTarget;
console.log("get data : ",request.response);
var responseLabel = new egret.TextField();
responseLabel.size = 18;
responseLabel.text = "GET response: \n" + request.response.substring(0, 50) + "...";
this.addChild(responseLabel);
responseLabel.x = 50;
responseLabel.y = 70;
}
private onGetIOError(event:egret.IOErrorEvent):void {
console.log("get error : " + event);
}
private onGetProgress(event:egret.ProgressEvent):void {
console.log("get progress : " + Math.floor(100*event.bytesLoaded/event.bytesTotal) + "%");
}
跟发送 GET 请求类似,发送 POST 请求的代码如下:
var request = new egret.HttpRequest();
request.responseType = egret.HttpResponseType.TEXT;
//设置为 POST 请求
request.open("http://httpbin.org/post",egret.HttpMethod.POST);
request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
request.send();
request.addEventListener(egret.Event.COMPLETE,this.onPostComplete,this);
request.addEventListener(egret.IOErrorEvent.IO_ERROR,this.onPostIOError,this);
request.addEventListener(egret.ProgressEvent.PROGRESS,this.onPostProgress,this);
添加回调函数:
private onPostComplete(event:egret.Event):void {
var request = event.currentTarget;
console.log("post data : ",request.response);
var responseLabel = new egret.TextField();
responseLabel.size = 18;
responseLabel.text = "POST response:\n" + request.response.substring(0, 50) + "...";
this.addChild(responseLabel);
responseLabel.x = 300;
responseLabel.y = 70;
}
private onPostIOError(event:egret.IOErrorEvent):void {
console.log("post error : " + event);
}
private onPostProgress(event:egret.ProgressEvent):void {
console.log("post progress : " + Math.floor(100*event.bytesLoaded/event.bytesTotal) + "%");
}
发送带参数的请求
上面我们发送了一段空的请求到服务端,实际使用过程中一般都需要发送带参数的数据到服务端。首先来看一下我们发送数据的格式。在 HTTP 客户端,我们发送的数据一般以key和value的形式组成,多个数据之间用=相连。拼接之后形成如下的形式:
key1=value1&key2=valueP2
通过 GET 方法发送的参数会加到 URL 的后面拼接起来,所以参数以?分隔。POST 方法发送的参数需要先设置 HTTP 请求的头信息,告诉服务端是以什么样的形式来发送的数据。我们最常用的就是application/x-www-form-urlencoded,表示我们以key和value方式来格式化参数。服务端也可以用同样的方法来取到参数。
服务端获取参数配置
下面以 PHP 为例来简要说明发送和或取参数的基本过程。
PHP 环境配置请自行配置。其他后端语言同理。如果不使用key和value的方式获取数据,请参考相应语言的标准输入流的方式来获取。
首先建立get_testphp文件,在 PHP 中获得 GET 的参数可以通过一个全局数组$_GET[]来获取到。下面代码将获取并返回key为p1和p2的参数的值。
echo $_GET['p1'];
echo $_GET['p2'];
?>
同理建立post_test.php,在 PHP 中通过全局数组$_POST[]来获取参数。下面代码将获取并返回key为p1和p2的参数的值。
echo $_POST['p1'];
echo $_POST['p2'];
?>
客户端发送参数
我们已经建立了两个 PHP 文件,下面向他们来发送参数。
首先是 GET 请求,GET 请求需要将参数拼接到 URL 后面来实现。其中 URL 和 参数之间需要用 ? 来链接。修改上面 GET 请求相应代码如下:
//拼接参数
var params = "?p1=getP1&p2=getP2";
var request = new egret.HttpRequest();
request.responseType = egret.HttpResponseType.TEXT;
//将参数拼接到url
request.open("php/get_test.php"+params,egret.HttpMethod.GET);
request.send();
发送 POST 请求. 需要注意的是发送 POST 请求需要将参数放到send方法的参数中发送出去。并且要设置其响应头,在我们的例子中使用key value 的方式来格式化参数,这里需要设置响应头Content-Type为application/x-www-form-urlencoded。修改上面 POST 请求相应代码如下:
//拼接参数
var params = "p1=postP1&p2=postP2";
var request = new egret.HttpRequest();
request.responseType = egret.HttpResponseType.TEXT;
request.open("php/post_test.php",egret.HttpMethod.POST);
//设置响应头
request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
//发送参数
request.send(params);
完整代码如下:
/**
* 下面的示例使用 egret.HttpRequest 类进行网络通信。
*/
class Main extends egret.DisplayObjectContainer {
private statusGetLabel:egret.TextField;
private statusPostLabel:egret.TextField;
public constructor() {
super();
this.sendGetRequest();
this.sendPostRequest();
}
private sendGetRequest():void {
var statusGetLabel = new egret.TextField();
this.statusGetLabel = statusGetLabel;
statusGetLabel.size = 18;
statusGetLabel.text = "GET request being sent to httpbin.org";
this.addChild(statusGetLabel);
statusGetLabel.x = 50;
statusGetLabel.y = 40;
var params = "?p1=getP1&p2=getP2";
var request = new egret.HttpRequest();
request.responseType = egret.HttpResponseType.TEXT;
request.open("php/get_test.php"+params,egret.HttpMethod.GET);
request.send();
request.addEventListener(egret.Event.COMPLETE,this.onGetComplete,this);
request.addEventListener(egret.IOErrorEvent.IO_ERROR,this.onGetIOError,this);
request.addEventListener(egret.ProgressEvent.PROGRESS,this.onGetProgress,this);
}
private onGetComplete(event:egret.Event):void {
var request = event.currentTarget;
console.log("get data : ",request.response);
var responseLabel = new egret.TextField();
responseLabel.size = 18;
responseLabel.text = "GET response: \n" + request.response.substring(0, 50) + "...";
this.addChild(responseLabel);
responseLabel.x = 50;
responseLabel.y = 70;
this.statusGetLabel.text = "Get GET response!";
}
private onGetIOError(event:egret.IOErrorEvent):void {
console.log("get error : " + event);
}
private onGetProgress(event:egret.ProgressEvent):void {
console.log("get progress : " + Math.floor(100*event.bytesLoaded/event.bytesTotal) + "%");
}
private sendPostRequest() {
var statusPostLabel = new egret.TextField();
this.statusPostLabel = statusPostLabel;
this.addChild(statusPostLabel);
statusPostLabel.size = 18;
statusPostLabel.x = 300;
statusPostLabel.y = 40;
statusPostLabel.text = "Sending POST request to httpbin.org";
var params = "p1=postP1&p2=postP2";
var request = new egret.HttpRequest();
request.responseType = egret.HttpResponseType.TEXT;
request.open("php/post_test.php",egret.HttpMethod.POST);
request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
request.send(params);
request.addEventListener(egret.Event.COMPLETE,this.onPostComplete,this);
request.addEventListener(egret.IOErrorEvent.IO_ERROR,this.onPostIOError,this);
request.addEventListener(egret.ProgressEvent.PROGRESS,this.onPostProgress,this);
}
private onPostComplete(event:egret.Event) {
var request = event.currentTarget;
console.log("post data : ",request.response);
var responseLabel = new egret.TextField();
responseLabel.size = 18;
responseLabel.text = "POST response:\n" + request.response.substring(0, 50) + "...";
this.addChild(responseLabel);
responseLabel.x = 300;
responseLabel.y = 70;
this.statusPostLabel.text = "Get POST response!";
}
private onPostIOError(event:egret.IOErrorEvent):void {
console.log("post error : " + event);
}
private onPostProgress(event:egret.ProgressEvent):void {
console.log("post progress : " + Math.floor(100*event.bytesLoaded/event.bytesTotal) + "%");
}
}
egret php交互,egret 发送HTTP请求相关推荐
- Ionic+Angular+Express实现前后端交互使用HttpClient发送get请求数据并加载显示(附代码下载)
场景 Ionic介绍以及搭建环境.新建和运行项目: https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/106308166 在上面搭建起 ...
- egret php交互,微信小游戏API调用Egret
野子电竞数据官网改版https://www.xxe.io/全新登场 在Egret中是可以直接调用微信小游戏的API的,Egret中添加了平台代码,可以调用各个平台API. 新建工程会发现在src文件夹 ...
- dart系列之:浏览器中的舞者,用dart发送HTTP请求
文章目录 简介 发送GET请求 发送post请求 更加通用的操作 总结 简介 dart:html包为dart提供了构建浏览器客户端的一些必须的组件,之前我们提到了HTML和DOM的操作,除了这些之外, ...
- 控制发送的请求条数_一个 HTTP 请求的曲折经历
关注"逆锋起笔"领取视频教程☞ 程序员进阶必备资源免费送「各种技术!」 ☜ 来源:www.neroht.com/article-detail/18从一个经典的面试题说起,输入URL ...
- Servlet交互【重定向 与 请求分派】详解
Servlet交互 在serlvet中,需要调用另外一个资源来对浏览器的请求进行响应,两种方式实现: 调用HttpServletResponse.sendRedirect 方法实现 重定向 调用Req ...
- ajax get请求_python测试开发django50.jquery发送Ajax请求(get)
前言 有时候,我们希望点击页面上的某个按钮后,不刷新整个页面,给后台发送一个请求过去,请求到数据后填充到html上,这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新.Ajax可以完美的 ...
- Java发送Http请求,解析html返回
今天是2008年7月7日星期一,下午一直在学校做个人开始页面.因为离不开google的翻译,所以想把google的翻译整合到我的开始页面中来,于是乎就遇到了一个问题,怎样使用java程序发送http请 ...
- 使用 axios 发送 http 请求
本文是我在学习过程中记录学习的点点滴滴,目的是为了学完之后巩固一下顺便也和大家分享一下,日后忘记了也可以方便快速的复习. 使用 axios 发送 http 请求实战 前言 一.axios 简介与安装及 ...
- python接收http请求_python通过get,post方式发送http请求和接收http响应
您可能感兴趣的话题: python 核心提示: 本文实例讲述了python通过get,post方式发送http请求和接收http响应的方法.分享给大家供大家参考. 本文实例讲述了python通过get ...
最新文章
- C++标准库中sstream和strstream的区别
- Ubuntu用apt-get安装报错:E: Could not get lock /var/lib/dpkg/lock-frontend - open (11:资源暂时不可用)
- Docker教程-安装
- python画图数据的平均值怎么算的_Python气象数据处理与绘图(2):常用数据计算方法...
- 美国华尔街拥抱区块链是最大的威胁
- UC浏览器电脑版怎么开启免费WiFi
- Java 网络处理(net io URL 等)
- ASP.NET MVC+LINQ开发一个图书销售站点
- 利用EasyRecovery恢复照片文件的技巧
- iconfont采坑
- html5读取运动传感器,一种基于六轴传感器的脚步运动识别方法与流程
- Eclipse启动问题:An error is occurred
- 如何写一封好的情书?Python三步爬取全网情诗信息
- Xposed获取微信好友列表(通讯录),看看这是你要的详细吗
- 吱呦app-想法-交友软件
- iPad air 1 7.1.2升级IOS 11
- Linux命令之输出文件尾部内容tail
- 微服务拆分原则之 AKF
- 天没有塌下来,这里有GitHub之外的五个最佳选择
- 科技节图像后期处理二等奖作品---陪伴是最长情的告白