Egret社区

[教程文档] Lakeshore 中 Ajax 组件的使用方法

2016-7-25 15:52
833229
本帖最后由 flep 于 2017-2-16 10:33 编辑

作者:Lakeshore - 阿勇

可能有些同学不知道Ajax是做什么的,其实我们可以直接从百度找到答案,是一种在浏览器中与Web服务器之间使用异步数据传输的技术,即通过HTTP请求与服务器进行消息传输的技术,可以在不刷新浏览器的情况下更新数据。
所以我们可以利用Ajax组件来与服务器进行消息传输,通过此技术我们可以利用lakeshore做网络游戏。
下面我们详细讲解Lakeshore如何使用Ajax组件与服务器进行通讯。
下载最新版Lakeshore,并打开,创建一个Ajax测试项目,取名为:AjaxDemo,如图:
Lakeshore中Ajax组件教程265.png
选好设备类型后,点击确定
Lakeshore中Ajax组件教程287.png

Ajax组件与普通组件不一样,Ajax是工具内置的一种组件,与System组件一样,不需要将此组件添加到场景中,可以直接引用。点击 Lakeshore中Ajax组件教程354.png 按纽,切换到事件表编辑栏,如图:
Lakeshore中Ajax组件教程372.png
点击事件表工具栏里的“新建事件”按纽,在弹出的“选择类型”对话框中选择目标“System”组件,如图:
Lakeshore中Ajax组件教程426.png
双击进入“条件列表”中,找到“场景初始化完成”条件,如图:
Lakeshore中Ajax组件教程459.png
双击选择,并确定,如图:
Lakeshore中Ajax组件教程473.png
点击“添加动作”,选择目标“ajax”,如图:
Lakeshore中Ajax组件教程499.png
双击“Ajax”,进入“动作列表”中,选择“发送数据”,如图:
Lakeshore中Ajax组件教程533.png
双击“发送数据”,打开“发送数据”属性设置对话框,如图:
Lakeshore中Ajax组件教程564.png
这里有四个选项,“标记”,“地址”,“数据”,“类型”。下面解释下这四个选项如何填写:在讲解如何填写之前先解释下客户端与服务器的消息收发机制。何为客户端,你可以认为是你利用Lakeshore做的游戏,也就是通常所说的前端。何为服务端,实际上就是我们通常所听到的服务器,服务器主要用于数据保存,数据计算,数据同步等操作。通俗的讲,比如我们通常所讲的游戏中的排行版,A玩家的分数在全国所占百分比,B玩家的分数在全国所占百分比等,这个百分比是由谁算出来的,自然是服务端,因为作为客户端的A来讲,是不可能知道客户端B的分数的,也就没法算出百分比,所以这个百分比的计算得交给服务器来计算,服务器计算完毕之后,分别告诉客户端A与客户端B。如图:
Lakeshore中Ajax组件教程887.png
也就是说服务器是一个中心处理器,A,B只是显示处理后的结果。1、标记:实际上是为了区分多条消息所设定的一个标记名,后面可通过此标记名来获取服务器发的不同消息,我们可以自己定义这些标记名,这个与服务器没有任何关系,假如服务器给我们发了三条消息,分别为:“收到消息1”,“收到消息2”,“收到消息3”,我们可以在此设定这三条消息的标记分别为:“message1,message2,message3,对于每条消息来讲,只需一个消息标记,这里取“message1”。2、地址:这里填写与服务器通读的地址,一般情况下,这里由服务器告诉。3、数据:你与服务器通讯时所包含的内容,内容格式需要与服务器进行约定,这里数据格式只支持字符串,比如“score:20,服务器收到这个后就可以知道当前的分数。4、类型:分为POSTGET,这是与服务器交互的方式,通常应该与服务器保持一致。如图:
Lakeshore中Ajax组件教程1279.png

有时候,我们不需要向服务器传递数据,只需要通知下服务器,那么,可以使用动作: Lakeshore中Ajax组件教程1319.png 。上面所讲都是向服务器传递数据,那么,服务器收到我们传递过去的数据后,进行处理,处理完成之后,通常会向我们发送数据,也就是说,我们需要有个接收服务器数据的入口,而Lakeshore也提供了接收服务器数据的方法。点击“新建事件”,在弹出的“选择条件目标”对话框中,我们选择“Ajax”组件,如图:
Lakeshore中Ajax组件教程1470.png
双击“Ajax”,在弹出的“条件列表”中选择“请求完成时”,如图:
Lakeshore中Ajax组件教程1506.png
双击,弹出“请求完成时”属性设置对话框,如图:
Lakeshore中Ajax组件教程1532.png

有一个参数“标记”,之前我们向服务器发送了以“message1”为标记的数据,服务器处理完毕之后,会将“message1”所带的数据返回给我们,所以我们这里填“message1”。为了取得“message1”所带的数据,我们先在场景插入一个文本组件,如图:
Lakeshore中Ajax组件教程1663.png
再切换到事件表,在动作里显示得到的数据,如图:
Lakeshore中Ajax组件教程1689.png

*注意!:在调试过程中,如果发现服务器没有返回值,多半原因是由于跨域问题导致。这时需要再服务器添加一个安全策略文件就可以解决问题了。

还有问题的话,欢迎大家跟帖回复。

分享到 :
1 人收藏

29 个回复

倒序浏览
奋发向上的岩哥  斑竹 | 2016-7-25 16:38:19
dengwen0220  登堂入室 | 2016-7-26 12:52:49
奋青  登堂入室 | 2016-7-27 13:11:27
longdingsheng  初学乍练 | 2016-10-7 14:46:26
本帖最后由 longdingsheng 于 2016-10-7 22:37 编辑

ajax 数据库添加记录 给个例子可以吗?
virsual  登堂入室 | 2017-1-13 19:41:38 来自手机
这个ajax不能处理json
flep  社区管理员 | 2017-1-16 10:26:47
virsual 发表于 2017-1-13 19:41
这个ajax不能处理json

json是用js的语句来处理的。你需要怎么个处理法?
virsual  登堂入室 | 2017-1-17 06:59:27
flep 发表于 2017-1-16 10:26
json是用js的语句来处理的。你需要怎么个处理法?

比如我要更新多个text的内容,如果ajax不是返回json的话那就得每个text都要对应一个ajax请求了?
virsual  登堂入室 | 2017-1-17 07:16:19
virsual 发表于 2017-1-17 06:59
比如我要更新多个text的内容,如果ajax不是返回json的话那就得每个text都要对应一个ajax请求了? ...

json组件有这个功能,但是这个组件不足的是,他在程序加载的时候就自动加载了,要是能设置个enable属性就好了,还有json的请求连接也能动态设置,这个组件就完美了
flep  社区管理员 | 2017-1-17 09:25:27
virsual 发表于 2017-1-17 07:16
json组件有这个功能,但是这个组件不足的是,他在程序加载的时候就自动加载了,要是能设置个enable属性就 ...

ajax是可以返回json的,返回的json就是一串字符,你按json的格式拆分出你要的部分就行了。

点评

cool  发表于 2017-6-21 20:49
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

小黑屋|京网文[2014]0791-191号|京ICP证150115号|Egret社区 ( 京ICP备14025619号 )

Powered by Discuz! X3.4 © 2001-2019 Comsenz Inc.

返回顶部