apifm-wxapi

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. 平台配置

  1. 设置AppID 和 Secreat

【微信设置】->【小程序设置】-> 【配置AppID/Secreat】

在这里插入图片描述
这里的AppID 和 Secreat 来自于小程序管理后台,【开发】-> 【开发管理】->【开发设置】->【开发者ID】

在这里插入图片描述
如果没有Secreat的话就生成一个,如果忘记了就重置即可。

  1. 配置专属域名

【首页】-> 【基本信息】-> 可编辑专属域名,这个需要在项目里初始化 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之后,用微信小程序开发者工具打开,需要修改两处:

  1. WXAPI.init()

在 app.js 里将 WXAPI.init('gooking') 配置成自己的专属域名。

const WXAPI = require('apifm-wxapi')

App({
    
    
  onLaunch: function () {
    
    
    WXAPI.init('改为自己的专属域名') // 配置专属域名
  },
  globalData: {
    
    

  }
})

管理后台 https://admin.it120.cc/#/dashboard 的首页有自己的专属域名
在这里插入图片描述

  1. AppID

在 project.config.json 文件里,找到appid,改成自己的AppID

  1. 注册

用微信小程序开发者工具打开这个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

猜你喜欢

转载自blog.csdn.net/Morris_/article/details/130614199