在此，我们将利用 Flash Builder 4 带给我们的新特性——“数据/服务/控件绑定”，通过 Http Service 来实现客户端与服务端之间的通信。

        

学习目标

        先来看看我们最终要实现什么：

        在文本框输入字符串“Sakura Momoko”，点击“send”按钮。客户端通过 Http Service 将字符串“Sakura Momoko”发送到服务端，服务端收到该字符串后返回一条欢迎信息。 （图六十二）

        

准备工作

        工欲善其事必先利其器，本节使用 Java Servelt 实现服务端的 Http Service，因此我们要准备相关的 Java 开发工具，以及 Servlet 容器同时，希望本节的读者对 Java Servlet 有一定的了解。

工具下载：
Java 开发工具：Eclipse 3.4
Servlet 容器  ：Tomcat 6.0

实现步骤

        接下去我们就一步步的来实现这一应用。

服务端：

1、首先使用 Eclipse 3.4 建立一个 Dynamic Web Project 来实现一个简单的 servlet ，工程结构如下图所示。 （六十三）

2、编写 servelt 实现类“HelloWorldServlet.java”。

package cn.airia.fb4.servlet;

import java.io.IOException;

import java.io.PrintWriter;

import javax.servlet.ServletException;

import javax.servlet.http.HttpServlet;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;

public class HelloWorldServlet extends HttpServlet {

         private static final long serialVersionUID = -5257137507666663400L;

         @Override

         protected void doPost(HttpServletRequest req, HttpServletResponse resp)

                          throws ServletException, IOException {

                 String name = req.getParameter("name");

                 PrintWriter pw = resp.getWriter();

                 pw.write("hello "+name+",welcome to Flash Builder's world");

                 pw.close();

         }

3、配置“web.xml”文件。

4、启动 web 容器 ，这里使用的是 Tomcat 6.0，在浏览器地址栏输入“http://localhost:8080/HttpService/hello.do”，若浏览器显示“hello null,welcome to Flash Builder's world”则表示服务端工作完成。

 

客户端：

1、新建一个 Flex 项目。 （图六十四）

2、为项目起名“HelloWorld”后按“完成”。 （图六十五）

3、在“HelloWorld.mxml”的“Design”视图中拖拉控件，绘制界面。这里用到的控件有 TextInput、Button、以及 Label。 （图六十六）

4、接下来几步就是本文的核心内容了，实现数据服务绑定的设置都在这里，是 Flash Builder 4 中特有的新功能，请同学们注意观看。点击菜单栏“数据”项，在下拉菜单中选择“连接Http…”（即 “连接Httpservice”）。 （图六十七）

5、在弹出窗口中进行如下设置。 （图六十八）

• 为 servlet 起一个操作名称这里为“sayHello”
• 在URL栏输入之前的 servlet 访问地址
• 方式采用“POST”
• 添加一个类型为“String”名称为“name”的传入参数
• 设置包名，这里设置为“cn.airia.fb4.services.helloservice”
• 点击“完成”

6、在“数据/服务”视图中操作的配置返回类型。

这里我们选择第二项“已经存在的 ActionScript 数据类型或者是之前已经自定义的类型”，选择“String”类型。 （图七十）

7、回到界面的“Design”视图，选中“Button”组件，在“属性”面板中对其进行设置，点击        选择单击时“生成服务调用”。 （图七十一）

在弹出窗口中进行如下设置后“确定“。

8、此时界面跳转至“Source”视图，函数的参数“name”呈高亮显示。

我们将这个“name”设置为 TextInput 控件的内容（为 TextInput 控件设置一个标示，这里起名为“textInputName”）。

9、接下去将返回的结果与 Label 控件进行绑定，选中 Label 后，在“属性”面板中点击“超链接”图标。 （图七十四）

在弹出窗体中进行如下设置后点击“确定”按钮。 （图七十五）

10、编码结束（其实我们基本没有手动编写代码噢 :) ），运行我们的程序看看效果吧