一步一步学Mule ESB——（第二篇：Ajax篇）
一步一步学Mule ESB——（第二篇：Ajax篇）
待完成功能
- 使用Ajax请求向后端发送请求
- 把网页的数据转换成请求的处理流
- 使用XSL and Mule Transformers转换成Google API可以理解的格式
- 创建一个Google API的拼写检查，处理网页输入
- 返回XML数据到页面
- 实施一个Jetty服务器在流程中
创建工程
创建工程ajaxflow，然后在ajaxflow.mflow中加入以下组件：
图：ajax请求流程
添加和配置Ajax接口
在ajaxflow.mflow中选择Global Elements：
图：选择全局元素
点击Create，出现Choose Global Type窗口。
打开Connectors，然后选择Ajax
图：选择接口中的Ajax
分别在Server URL和Resource Base中输入:
和 src/main/app/docroot
图：Ajax设置
点击OK完成就可以在列表中看到Ajax接口了。
图：Ajax接口
然后双击flow中的Ajax元素，配置Ajax Endpoint，设置Channel：
图：Channel设置
然后设置引用：
选择我们上边设置的Ajax全局接口。
配置XSLT转换
下载xsl文件：
保存进你的MuleStudio > examples > AjaxSpellChecker > TransformFile目录中
然后右键工程，选择Import，选择File System，导入刚才保存好的transform.xsl，将导入的文件放到工程的src\main\app目录下。
做完上面的步骤，双击XSLT transformer会出现Pattern Properties窗口，配置如下参数：
图：转换属性配置
配置Http请求
双击HTTP Endpoint出现Endpoint Properties窗口。
进行设置如下：
图：Http Endpoint设置
然后设置HTTP Settings，Content Type属性：
图：HTTP Settings设置
导入页面并测试
先新建文件夹，New > Folder. 名称为/main/app/docroot，然后在新建的文件夹上点右键，导入示例页面，
页面的位置在MuleStudio > examples > AjaxSpellChecker >HTMLfile中的SpellChecker.html文件。
然后启动Run as Mule Application，启动成功后我们能看到：
图：ajaxflow启动应用
然后打开浏览器输入http://127.0.0.1:8090/Ajax/SpellChecker.html
图：Ajax请求页面
根据输入内容的不同，控制台就会输出对应的处理内容了。
图：控制台打出的日志信息