小程序云开发教程

本文是一篇全面的小程序云开发实战教程,涵盖了从获取图书ISBN码到调用云函数、存储数据到云数据库、读取显示在小程序端的过程。通过调用微信小程序的wx.scanCode接口获取ISBN码,利用云函数请求豆瓣API获取图书信息,然后将数据存储到云数据库,并展示在小程序列表和详情页。教程还包括云函数依赖安装、豆瓣API调用、数据库操作等步骤。
摘要由CSDN通过智能技术生成

前言:

在学习云开发的时候将自己的学习过程记录下来了,放在了网上,收获了一波好评,今天下午在办公室没有事情,也发现之前有人在博客里面评论,你这个教程还有一半哩,可能是csdn的自动搬运功能出来一点小问题,没有搬运成功吧,这里就手动复制粘贴成为一篇了,篇幅比较长,如果有不足或者不注意写错的地方,欢迎大家提出纠正哦。

小程序云开发实战一:小程序扫一扫获取到图书ISBN码(图书条形码)

接触到云函数已经有一段时间了,之前一直在看api,现在自己跟着网络上的资料和视频学习,做了一个小项目,类似于豆瓣读书系列。
具体是这样的一个流程,后面会一步步的实现。

小程序扫码实现读取isbn,获取图书的各种信息
1:用户端小程序调用 wx.scanCode接口,获取到ISBN码
2:使用ISBN码调用云函数,在请求云函数的时候,云函数会请求豆瓣的API,获取豆瓣图书信息。
3:图书信息请求到之后,会将其中无用的信息返回给小程序中,小程序中再拿出获取到的信息,创建图书条目
4:将对应的数据直接存储到云开大的数据库里面

之前用过微信扫一扫功能,调用二维码,扫描自己生成的二维码,并将二维码的内容显示在界面的两个例子:

微信小程序扫一扫的功能实现:https://www.jianshu.com/p/e00b44293fe0
小程序扫码成功后带着参数跳转到指定页面:https://www.jianshu.com/p/413c5831ddd6

现在是用户端小程序调用 wx.scanCode接口,获取到图书ISBN码(图书条形码),在办公室找了一圈,找到了一本图书ISBN码,可以自动忽略我这渣渣的像素。

demo的示例:

在下面的示例代码里面,我是使用了小程序的组件库的,如果有遇到引入库的问题的可以查看:小程序动端组件库Vant Weapp的使用https://www.jianshu.com/p/10d75a3ca3d0

1:wxml

<van-button type="primary" bind:click="scanCode">扫码加书</van-button>

2:json

{
 "usingComponents": {
  "van-button": "../../vant/button/index"
}
}

3:js(page自动生成默认的各个函数,可以自己手动删除)

// pages/scanCode/scanCode.js
Page({

  /**
   * 页面的初始数据
   */
  data: {
   
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {

  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {

  },

scanCode: function (event) {
console.log(1)
  // 允许从相机和相册扫码
  wx.scanCode({
   onlyFromCamera:true,
   scanType:['barCode'],
   success:res=>{
     console.log(res.result)
   },
   fail:err=>{
     console.log(err);
   }
  })
  }

})

ok,获取到信息

 

关于参考的视频资料:可以跟着视频后面学习一下:https://cloud.tencent.com/developer/edu/learn-100005-1244/3154

小程序云开发实战二:小程序云开发云函数安装依赖步骤

1:安装nodejs,准备好环境,这一步就不细说了,没有安装的可以自行百度,不知道有没有安装的可以输入 node -v 查看一下。

2:新建一个云函数模板,在cloudfunctions目录底下,新建一个云函数的文件bookinfo。

 

3:在新建文件上右击文件,选择在终端打开。

 

这个时候会弹出一个cmd窗口。

 

4:在cmd 打开云函数目录中,安装依赖。
输入命令:

npm install --production

依赖安装成功之后,文件里面多会出现package-lock.json这个文件。

 

5:由于要请求网络,所以要安装请求网络的库,请求网络的库可以使用node.js中的request库,方便快捷:https://github.com/request/request

在小程序里面要使用的云函数是同步的,所以使用promise,因为使用传统的callback没有办法在控制台之中返回数据。

 


https://github.com/request/request-promise
安装方法:
通过这两行命令进行安装,复制命令

 

npm install --save request
npm install --save request-promise

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
微信小程序云开发教程主要涵盖了云开发的入门知识和相关功能的学习。云开发是微信团队与腾讯云合作推出的专业小程序开发服务。通过云开发,开发者可以快速开发小程序、小游戏和公众号网页等,并且能够直接使用平台提供的API进行业务开发,无需搭建服务器和进行鉴权。 云开发教程一般包括以下内容: 1. 云开发简介:介绍了云开发的基本概念和优势,以及如何使用云开发进行小程序开发。 2. 云数据库:介绍了云数据库的基本使用方法,包括数据的增删改查、数据权限控制等。 3. 云函数:介绍了云函数的作用和使用方法,包括如何编写和调用云函数,以及如何实现服务器端的业务逻辑。 4. 云存储:介绍了云存储的功能和使用方法,包括上传和下载文件、图片和视频等操作。 5. 扩展功能学习:介绍了如何使用云开发实现其他扩展功能,比如消息推送、支付等。 通过学习云开发教程,开发者可以快速掌握云开发的基本知识,从而能够更高效地进行小程序开发,并且能够利用云开发提供的各种功能来实现更多的业务需求。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *2* *3* [微信小程序云开发入门详细教程](https://blog.csdn.net/kobepaul123/article/details/121132576)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 100%"] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值