2021-05-24 微信小程序-扫码识别图书-一一网

前言，近期对微信云开发来了兴趣，上手一个微信扫码识别图书，并上传保存到云数据库中，涉及到以下几个方面的知识：小程序注册账号、小程序扫码API的使用、小程序云开发等

注册小程序账号

首先，通过手机号或邮箱注册一个小程序账号，拿到AppID，开通云开发权限，需要注意的是每⼀个⼩程序/公众号/⼩游戏都需要⼀个email，同⼀个⼿机号只能注册5个，同⼀个身份证也只能注册5个

云开发

必须注册微信小程序，不能使用测试号
免费的额度，云开发管理后台

实战扫码识别图书

1、使用小程序API-wx.scanCode()方法扫码图书背面的条形码获得版号ISBN

wx.scanCode({
    success: (res)=>{
        console.log(res.result) // 图书的版号ISBN
    }
})
复制代码

2、拿到版号后，新建一个云函数getbook，其实就是NodeJS，通过一个方法getBookInfo把ISBN作为参数再利用doubanbook这个npm包函数解码得到图书的封面cover_url和标题title

async function getBookInfo(isbn) {
  const url = 'https://search.douban.com/book/subject_search?search_text=' + isbn;
  const res = await axios.get(url)

  const reg = /window\.__DATA__ = "(.*)"/
  if (reg.test(res.data)) {
    const bookData = RegExp.$1
    const decryptedData = doubanbook(bookData)
    console.log(decryptedData);
    return decryptedData[0]
  }

  return res
}
复制代码

3、把图书信息保存到云数据库中，在云函数的main方法里连接云数据库books，保存图书的isbn、title、cover_url，其中isbn设置为主键，这样就不会重复上传图书

// 云函数入口函数
exports.main = async (event, context) => {
  // 获取图书的ISBN
  const {
    isbn
  } = event
  // 云函数数据库
  const db = cloud.database()
  const res = await getBookInfo(isbn)
  db.collection('books').add({
    data: {
      isbn,
      title: res.title,
      cover_url: res.cover_url
    }
  })
  // 获取数据库的全部图书
  const booksData = await db.collection('books').get()
  return {
    booksData: booksData.data,
    title: res.title,
    cover_url: res.cover_url
  }
}
复制代码

4、最后，在app端调用云函数getbook方法，做下图片的优化处理和展示即可，非常简单

// 扫码识别图书
  btnScan() {
    wx.scanCode({
      success: res1 => {
        // res.result是版号ISBN
        wx.cloud.callFunction({
          name: 'getbook',
          data: {
            isbn: res1.result
          },
          success: async res2 => {
            const booksData = res2.result.booksData;
            const isbn = res1.result
            // 重复上传则提示
            const isRepeat = booksData.every(item => item.isbn !== isbn)
            if (!isRepeat) {
              wx.showToast({
                title: '数据库中已存在',
                icon: "error"
              })
            } else {
              this.setData({
                title: res2.result.title,
                cover_url: res2.result.cover_url
              })
            }
          }
        })
      }
    })
  },
复制代码