下面小编就为大家分享一篇使用MUI框架构建App请求http接口实例代码，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
简介
最近在看Dcloud的MUI框架，MUI封装了android、ios等多个平台的原生接口，达到开发一个项目，采取不同打包方式，生产多种平台的app。
无可厚非，对于从事java web开发的工程师，带来了极大的福音，再也不用去花太多时间去学习原生的android、ios语言，大大缩短了app开发的学习周期和成本。
当然，既然是做了封装处理，肯定性能上面不如原生。但是Dcloud官方声称MUI是最接近原生App体验的前端框架，并且在一些低端机上的表现也比较理想，想必也做了不少优化处理，另一方面，随着手机市场的激烈竞争，手机配置及价格都越来越让人满意，性能问题就愈发的可以忽略不计，毕竟项目周期和成本也相当的重要！之前也了解过PhoneGap框架（仅仅是了解），据说，MUI的性能要比PhoneGap好。当然，仅仅是代表鄙人的观点，暂时也没有在重型或者大数据量项目上做过验证，只好大家各自体验了。
看得出来Dcloud还是做了不少事情的，再加上国产，这个还是要支持的！
MUI官方地址：http://www.dcloud.io/mui.html
好了，废话不多说，下面进入正题。
要用app请求http接口当然要分别有http接口和app应用。
1.创建http接口
我这里是做了一个很简单的java servlet的项目。
新建java web项目，项目名myhttp。web.xml中配置一个名为login的servlet请求：
login demo.webservice.LoginServlet login /login.do
demo.webservice目录下的LoginServlet.java代码：
package demo.webservice; 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; @SuppressWarnings("serial") public class LoginServlet extends HttpServlet{ @Override protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { this.doPost(req, resp); } @Override protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { System.out.println("进入post方法！"); req.setCharacterEncoding("utf-8"); resp.setCharacterEncoding("utf-8"); resp.setContentType("text/html;charset=utf-8"); PrintWriter out = resp.getWriter(); String name = req.getParameter("name"); String pwd = req.getParameter("password"); if("admin".equals(name) && "123".equals(pwd)){ //验证通过 out.write("Login Success!"); }else{ out.write("Login Fail!"); } out.flush(); out.close(); } }这里做了一个很简单的验证示例，若输入用户名和密码分别为“admin”、“123”，即验证通过，返回“Login Success”，否则返回“Login Fail”。因为仅仅是个示例，就不去连数据库啦！
OK，web端的http接口就开发完成了，通过地址“http://[ip地址]:[端口]/myhttp/login?name=admin&password=123“即可访问该servlet请求，得到返回结果。
我这里装逼格了一下，把web应用发布到了自己的服务器上，模拟实际场景嘛！当然大家在本地也是可以的，可以通过浏览器访问本地项目地址访问。HBuilder工具是支持本地浏览器调试的。
2.使用HBuilder创建基于MUI框架的App
既然是基于MUI框架的App，当然要用Dcloud推出的HBuilder这款IDE开发啦，另外说明下，这款IDE开发前台确实超级棒，可以大幅度提升开发效率，HBuilder是基于Eclipse改造的，同时添加了很多便利的提示和快捷键功能，同时还支持EMMET规则。用官方的话就是：飞速编码的极客工具，手指爽，眼睛爽――让手爽，飞一般的编码（这里不是打广告哈，自己亲身体验过，确实很方便）。
在HBuilder中新建项目――移动App，输入应用名称（我这里应用名为MUIDemo1），选择“mui项目”。
点击完成，便生成了一个已包含mui的js、css、字体资源的项目模板。如图所示：
OK，一个基础的App应用的框架就搭建好了。
3.页面编写，具体调用接口实现。
下面开始编写具体页面和实现接口的调用。
我这里为了方便，直接从”HelloMUI”项目模板中examples目录下copy了一个ajax.html示例页面置于MUIDemo1项目的根目录下。大家可以在新建移动App项目时选择“Hello mui”模板即可生成。
打开ajax.html页面，里面的一些css、js引入路径需要改一下，因为我直接把ajax.html页面放到了我新建项目中的根目录（原来是在examples目录下）。
这里说明下，MUI是采用ajax方式发送请求的，平时习惯，一些我们在后台的代码处理MUI都是在js中编写的(现在的js不仅仅涉及前端的技术了，比如node.js)。
因为ajax.html中已经包含了一个完整的ajax请求示例，所以，只需要在这基础上做下修改即可。修改后的页面代码如下：
