微信小程序调用MobAPI实现【微信精选】

微信精选.png 微信精选.png

先上两张截图，展示一下效果！

在去年微信小程序公测阶段，各大开发者社区就对微信小程序进行激烈的讨论！现如今微信小程序已经正式发布，有关微信小程序的文章在各大开发社区依然是热门话题。大家都想要去了解这一新新的技术，想要从微信小程序这儿分一杯羹，我也不例外。所以我用了一周的时间去研究了微信小程序的文档，简单的了解了微信小程序的一个搭建流程，并做了一个小Demo

接下来我会通过这个【微信精选】的搭建案例来向大家介绍一个微信小程序是如何快速搭建的。

首先我们要在微信公众平台上注册一个小程序账号

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

公众平台.png 小程序.png

注册成功之后你就可以登录到你小程序的管理后台，并看到你小程序的AppID，待会儿会用到。

小程序后台.png

然后到这个地址下载小程序的开发工具

https://mp.weixin.qq.com/debug/wxadoc/dev/devtools/download.html?t=20161221

工具下载.png

安装成功之后就可以通过微信扫码登录开发工具了

登录.png

接下来我们先不急着去创建一个项目，先来让大家看一个网站

http://www.coolsite360.com/wxapp/?utm_source=baidu&utm_medium=cpc&utm_campaign=%E5%BE%AE%E4%BF%A1%E5%B0%8F%E7%A8%8B%E5%BA%8F&utm_content=%E4%BD%9C%E5%93%81%E8%AF%8D

这个网站可以在线制作微信小程序的界面，无需写代码套用模板即可，导出代码之后就可以在静态界面基础上绑定数据，使其成为动态界面。

Coolsite360.png

至于如何使用，网站内有详细的教程，这里就不做过多的描述。我就直接将导出后的代码用小程序编辑器打开。

weixin.png

之后就可以对照微信小程序的开发文档将页面更改成动态内容

文档地址 https://mp.weixin.qq.com/debug/wxadoc/dev/index.html

最后说一下MobAPI，他免费提供各种接口的调用，只需要注册一个账号并申请对应接口的appkey就可以使用了。

MobAPI地址 http://www.mob.com/

jiekou.png

当然微信小程序要想调用外部接口，必须在小程序的后台添加 request合法域名，否则无法调用。

request.png

接下来就是微信小程序的调试，在微信开发工具中通过扫码就可以实现真机调试。

tiaoshi.png

通过这个案例相信大家对微信小程序也有了一个基本的了解，在文章底部我会分享出这个案例的源码，大家可以结合我的Dome来制作属于自己的微信小程序。

源码地址: http://pan.baidu.com/s/1c7qTK6 密码: i7k1