文章目录
- apifm-wxapi
- 介绍
- 为什么要用 apifm-wxapi
- 使用
- 1. 项目导入 apifm-wxapi
- 2. 平台注册
- 3. 平台配置
- 4. 用户注册
- 5. 用户登录
- 6. 使用其他API
- 【参考】
apifm-wxapi
介绍
“微信小程序接口工具包,无需服务器,无需开发后台,开箱即用,轻松开发小程序。”
一般的,我们做一个前端或者客户端的App,大都是需要后台做数据支撑,我们通过调用服务器端的接口(API)来获取数据,上传数据等。 apifm-wxapi 就免费提供了这样的功能。
apifm-wxapi 是一个第三方开源的库,我们在微信小程序开发中,将此库引入到项目中,可以使用它提供好的一些接口。同时它还有一个后台管理平台,https://admin.it120.cc,登录这个管理后台可以配置我们需要的模块,这个后台主要是一些商城类的东西。通过开通管理平台账号和所需要的功能模块,加上在项目里导入的 apifm-wxapi,就可以使用 apifm-wxapi 提供的一些商城类的API来完成我们的微信小程序开发了。
这个对于初学者来说很友好,初学者没有后台,做一个商城类的小程序,数据可以免费从 https://admin.it120.cc
里来,在微信小程序里直接用 apifm-wxapi
即可。
为什么要用 apifm-wxapi
对于一个微信小程序的初学者来说,apifm-wxapi 这个第三方库提供了一些API,我们可以在小程序里使用这些接口来做一个商城类的小程序项目。apifm-wxapi 与管理后台 https://admin.it120.cc 是对应的,我们在管理后台里设置我们所需要的功能模块,在微信小程序里调用apifm-wxapi的接口就可以拿到对应的数据。
对于初学者来说有些晦涩,下面我们直接看如何使用就可以了。
使用
1. 项目导入 apifm-wxapi
cd 到项目目录下
cd /Users/morris/WeChatProjects/miniprogram-1
使用npm直接安装
npm install apifm-wxapi
安装完之后,进入到项目里进行构建即可
2. 平台注册
浏览器打开 https://admin.it120.cc
,如果没注册过,先注册,注册完之后登录系统。
开始的时候,管理平台上的左侧菜单栏只有几项,需要添加一些模块:
【工厂设置】->【模块管理】->【启动所有模块】
之后刷新页面,左侧菜单栏里面就会出现很多模块。
3. 平台配置
- 设置AppID 和 Secreat
【微信设置】->【小程序设置】-> 【配置AppID/Secreat】
这里的AppID 和 Secreat 来自于小程序管理后台,【开发】-> 【开发管理】->【开发设置】->【开发者ID】
如果没有Secreat的话就生成一个,如果忘记了就重置即可。
- 配置专属域名
【首页】-> 【基本信息】-> 可编辑专属域名,这个需要在项目里初始化 apifm-wxapi 的时候用
const WXAPI = require('apifm-wxapi')
WXAPI.init('你的域名')
4. 用户注册
我第一次使用的时候,不记得有注册过用户,直接在微信小程序上,初始化 apifm-wxapi ,登录并上传了个人头像昵称等。
登录管理后台(https://admin.it120.cc/#/dashboard)首页,就有一个用户
【用户管理】模块的用户列表里也多了条数据:
有的人可能会遇到 {code: 10000, msg: "user has not exists"}
的问题,如果有此问题的话,要么自己在小程序里调用注册接口注册一个用户,要么也可以使用别人写的一个demo,里面有一个注册功能,来注册一个用户,注册完之后再进入自己的小程序里登录就可以了。
apifm-wxapi-demo:https://github.com/gooking/apifm-wxapi-demo
下载这个demo之后,用微信小程序开发者工具打开,需要修改两处:
- WXAPI.init()
在 app.js 里将 WXAPI.init('gooking')
配置成自己的专属域名。
const WXAPI = require('apifm-wxapi')
App({
onLaunch: function () {
WXAPI.init('改为自己的专属域名') // 配置专属域名
},
globalData: {
}
})
管理后台 https://admin.it120.cc/#/dashboard 的首页有自己的专属域名
- AppID
在 project.config.json 文件里,找到appid,改成自己的AppID
- 注册
用微信小程序开发者工具打开这个demo
里面有一个注册用户的模块,进入之后点击“简易注册”即可注册一个用户,注册完之后点击下面的登录按钮看会不会报错。
注册完用户之后再进自己的项目里就不会再报 {code: 10000, msg: "user has not exists"}
的问题了。
5. 用户登录
const WXAPI = require('apifm-wxapi')
WXAPI.init('这里改为你自己的专属域名')
App({
onLaunch() {
// 微信授权
wx.login({
success: res => {
console.log(res)
// 平台登录
WXAPI.login_wx(res.code, true).then(function (res) {
console.log(res)
if (res.code != 0) {
wx.showModal({
title: '无法登录',
content: res.msg,
showCancel: false
})
return;
}
wx.setStorageSync('token', res.data.token)
wx.setStorageSync('uid', res.data.uid)
})
}
})
},
globalData: {
userInfo: null
}
})
先调用微信授权,获取到res.code之后,调用 apifm-wxapi 提供的平台登录接口 WXAPI.login_wx() 可实现用户登录,登录后返回用户id和token。
6. 使用其他API
略…
【参考】
[1] apifm-wxapi github 地址:https://github.com/gooking/apifm-wxapi/
[2] apifm-wxapi 接口列表 https://github.com/gooking/apifm-wxapi/blob/master/instructions.md
[3] apifm-wxapi-demo:https://github.com/gooking/apifm-wxapi-demo