HTML5（WeX5框架）开发概述-创新互联

一、先了解什么是Hybrid App(混合模式移动应用)

企业建站必须是能够以充分展现企业形象为主要目的，是企业文化与产品对外扩展宣传的重要窗口，一个合格的网站不仅仅能为公司带来巨大的互联网上的收集和信息发布平台，创新互联建站面向各种领域：木屋等成都网站设计、网络营销推广解决方案、网站设计等建站排名服务。

http://baike.so.com/doc/6731462-6945763.html

二、这里先来尝试学习下国内免费开源框架WeX5

  1、先看看综合演示案例好了：http://www.wex5.com/portfolio-items/demo-wex5portal/

    2、下载些新手入门的视频看看：http://www.wex5.com/wex5-welcome/

  3、了解Baas（后端即服务：Backend as a Service）:http://baike.baidu.com/link?url=Q1r5OcvfyBX3b1Dcoip3wTztBqUZnGW-qqpaz1eokTSMpbX3g3MA1sgO_EbZOXmtyGfA9VU74JFC3n1jA6oi7q

        注：我们可以用ajax调用自己的后台服务（java/php等等后台），也可以使用X5提供的Bass服务直接访问数据库。

    4、Bootstrap(web前端css框架），WeX5基于它作的拓展：http://baike.baidu.com/link?url=oZs8VV9b9jzI9mI4aZgLzUaZd9h09vjGtv1EK0yU7D9iZtydVoJoiiYm0i4RP-ng3xL4pmjr9pweeBbsp-hvI6H_by3xf9cO7u3LAmFmi_q

        例一：使用媒体对象组件，http://v3.bootcss.com/components/#media 。按它的div布局，调用其class名称，便可以有Bootstrap的模版效果了。

        例二：栅格系统及其响应式布局处理： http://v3.bootcss.com/css/#grid

        bootstrap中文网（查询手册）：http://www.bootcss.com/

        学习bootstrap（基础篇） http://www.imooc.com/learn/141

    学习bootstrap（js插件篇） http://www.imooc.com/learn/262

    5、视频是基于Baas的，如果要使用自己的web服务端，那就按正常的ajax方案调用，再结合WeX5来处理。值得注意的一点是：由于是访问另一个服务端，所以要解决跨域访问的问题，方案比较简单，

http://www.wex5.com/ajax-cors-jsonp/

    6、关于部署（把需要的文件部署到一个新的tomcat,发布外网就不作说明了）：

        A、把E:\WeX5\model\Native\外卖\www 目录下项目文件（例如：wm）复制到 D:\Tomcat6.0\webapps

        B、把E:\WeX5\apache-tomcat\webapps\app-template目录下的WEB-INF复制到D:\Tomcat6.0\webapps\wm目录下

        C、把E:\WeX5\runtime目录下的BaasServer复制到D:\Tomcat6.0\webapps目录下，并且更名为bass。

        D、把E:\WeX5\apache-tomcat\conf\context.xml文件中的数据库相关的配置复制到D:\Tomcat6.0\conf\context.xml文件中。

        E、把E:\WeX5\apache-tomcat\lib目录中的mysql-connector-java-5.1.36-bin.jar复制到D:\Tomcat6.0\lib目录中

        F、运行tomcat访问http://127.0.0.1:8181/wm/index.html

    可能会出现的错误：

        a、如果新tomcat的jdk版本比WeX5使用的jdk版本低，启动tomcat会报错。

        b、D:\Tomcat6.0\webapps\wm\WEB-INF\web.xml文件中的<url-pattern>*</url-pattern>可能会报错。改成<url-pattern>/*</url-pattern>就好了。

        <filter-mapping>

<filter-name>resourceFilter</filter-name>

<url-pattern>/*</url-pattern>

   </filter-mapping>

文档位置：

  http://docs.wex5.com/ 此处搜索你想要的Wex5开发说明，例：“页面跳转”

    案例汇总清单：http://docs.wex5.com/learning-resource-cases/

链接备忘：

    1、申请微信测试帐号

    http://mp.weixin.qq.com/debug/cgi-bin/sandbox?t=sandbox/login

    2、申请服务号

    https://mp.weixin.qq.com/

    注：接入方式和测试号查不多，先看微信的文档，少走弯路，毕竟WeX5的教程很多都不具体。

https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421135319&token=&lang=zh_CN

根据文档描述的配置好服务器配置之后，记得启用该功能，然后关注公众号，同样是发送memu刷新菜单。

    3、微信公众号本地测试

    http://blog.qqbrowser.cc/wei-xin-gong-zhong-hao-ben-di-diao-shi/

    注：正确的返回路径应该是类似这样的（没有端口）：

    http://fw5i7hei9d.proxy.qqbrowser.cc/x5/UI2/v_51ef0819c3504fc4a6cc66896e71db3cl_zh_CNs_d_/zanshequ/index.w

    编码后：

    http%3A%2F%2Ffw5i7hei9d.proxy.qqbrowser.cc%2Fx5%2FUI2%2Fv_51ef0819c3504fc4a6cc66896e71db3cl_zh_CNs_d_%2Fzanshequ%2Findex.w

    4、wex5微信公众号支付开发

  wex5文档：http://doc.wex5.com/pay-mp-step-by-step/#5

        补充：此文档页面最下方的常见问题很有用，第4点就是我遇到的。早看到就好了，也怪坑人的“抢先版”。

    微信官方文档：https://pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=7_4 （页面下方）

        补充：遇到签名错误问题，看了文档才知道，weixin.config.xml中的appkey 是要去微信商户平台(pay.weixin.qq.com)设置的，路径：账户设置-->API安全-->密钥设置。

   5、微信接口返回码说明：

    https://mp.weixin.qq.com/wiki/17/fa4e1434e57290788bde25603fa2fcbd.html

    

    6、关于用户授权、获取用户信息的规则，重点看一下。

      https://mp.weixin.qq.com/wiki/17/c0f37d5704f0b64713d5d2c37b468d75.html

Wex5开发使用快捷键：

    1、js事件方法中获取当前行：listrow + alt /

另外有需要云服务器可以了解下创新互联cdcxhl.cn，海内外云服务器15元起步，三天无理由+7*72小时售后在线，公司持有idc许可证，提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案，具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势，专为企业上云打造定制，能够满足用户丰富、多元化的应用场景需求。

当前文章：HTML5（WeX5框架）开发概述-创新互联
文章地址：/article30/ejcso.html

成都网站建设公司_创新互联，为您提供网站设计公司、外贸建站、微信公众号、全网营销推广、网站营销、动态网站

广告

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源： 创新互联