微信小程序之云开发

ch_s_t

于 2024-08-06 18:46:00 发布

阅读量359

点赞数 12

分类专栏：微信小程序文章标签：微信小程序小程序

本文链接：https://blog.csdn.net/ch_s_t/article/details/140960693

版权

微信小程序专栏收录该内容

7 篇文章 1 订阅

订阅专栏

微信小程序的云开发是一种基于云的解决方案，旨在帮助开发者更便捷地构建、部署和管理小程序。以下是一些关键概念和功能：

一、基础概念

1、主要类型

云函数：可以在云端运行的代码，可以用来处理复杂的逻辑、数据库操作等，避免在小程序的客户端执行。

云数据库：提供数据库服务，支持数据的存储、查询和管理，开发者无需担心底层的数据库维护。

云存储：可以上传和管理图片、音频等文件，支持直接在小程序中调用和显示。

2. 工具和文档

微信官方提供了详细的文档和示例，帮助开发者快速上手云开发。可以参考微信小程序云开发文档获取更多信息。

二、使用流程

（1）环境准备

注册微信开发者账号：首先需要一个微信开发者账号，并且在微信公众平台注册小程序。

下载微信开发者工具：在微信官方开发者网站下载并安装微信开发者工具。

（2）创建云开发环境

打开微信开发者工具：以小程序项目为基础创建或打开项目。

启用云开发：在开发者工具左侧菜单中找到“云开发”选项，点击“启用云开发”。系统会提示你创建一个云开发环境，选择环境名称和地域，然后完成创建。

（3）使用云功能

a. 云函数

创建云函数：在云开发控制台中，选择“云函数”，点击“新建云函数”。可以选择模板或者自定义新函数，并编写业务逻辑。

上传和部署：编写完云函数后，可以直接在开发者工具中上传并发布。

b. 云数据库

创建数据集合：在云开发控制台中，选择“云数据库”，创建集合并定义数据结构。

进行数据操作：在代码中使用 wx.cloud.database() 接口进行查询、添加、更新和删除等操作。

c. 文件存储

上传文件：使用 wx.cloud.uploadFile() 方法将文件上传至云存储。

下载文件：使用 wx.cloud.getTempFileURL() 方法获取文件的临时链接。

（4）测试和调试

本地调试：在开发者工具中，使用“云函数”选项进行调试，查看日志，实时调整代码。

真机测试：将小程序上传到微信后台，使用真机进行测试，确保云功能正常运行。

（5）监控和管理

查看日志：通过云开发控制台查看云函数执行日志，监控性能和错误排查。

管理数据库：在云数据库控制台中管理数据集合，进行数据监控和操作。

（6）发布

提交审核：完成开发后，按照小程序发布流程向微信团队提交审核。

上线运营：审核通过后，小程序将上线，用户可以通过微信访问。

（7）后续维护

升级功能：根据用户反馈和需求，持续优化和迭代小程序。

监控性能：定期查看使用情况、性能指标和访问日志，确保小程序平稳运行。

三、云数据库使用示例

微信小程序云数据库是云开发能力中的一项，它提供了一种简单方便的方式来存储和管理小程序的数据。下面是一个使用云数据库的示例：

1、在小程序的app.js文件中初始化云开发

App({
  onLaunch: function () {
    wx.cloud.init({
      env: 'your-env-id' // 替换成你的云环境ID
    })
  }
})

2、在需要使用云数据库的页面中引入云开发

const db = wx.cloud.database()

3、插入数据

db.collection('todos').add({
  data: {
    title: '学习小程序云数据库',
    createTime: db.serverDate()
  },
  success: function(res) {
    console.log(res)
  },
  fail: function(err) {
    console.error(err)
  }
})

4、查询数据

db.collection('todos').get({
  success: function(res) {
    console.log(res.data)
  },
  fail: function(err) {
    console.error(err)
  }
})

5、更新数据

db.collection('todos').doc('todo-id').update({
  data: {
    title: '学习云数据库'
  },
  success: function(res) {
    console.log(res)
  },
  fail: function(err) {
    console.error(err)
  }
})

6、删除数据

db.collection('todos').doc('todo-id').remove({
 
  success: function(res) {
    console.log('删除成功'+res)
  },
  fail: function(err) {
    console.error(err)
  }
})

四、云函数使用示例

微信云函数是一种无需自建服务器，即可运行代码的云服务。使用微信云函数可以方便地处理小程序的后端逻辑，如数据库操作、数据处理等。

下面是一个微信云函数的使用示例：

1、创建云函数

在微信开发者工具中，右键点击云函数文件夹，选择"新建云函数"。在弹出的对话框中输入云函数名称，并选择云函数的触发条件和执行环境。点击"确定"按钮即可创建云函数。

2、编写云函数代码

在云函数文件夹中，找到新创建的云函数文件，双击打开。在打开的代码编辑器中，编写云函数的代码逻辑。可以使用JavaScript、TypeScript或Python来编写代码。例如，以下是一个使用JavaScript编写的云函数示例：

const cloud = require('wx-server-sdk');
cloud.init({ env: cloud.DYNAMIC_CURRENT_ENV });

// 云函数入口函数
exports.main = async (event, context) => {
 return {
    dataList: [
      { _id: '1', title: '微信气泡徽章', price: 1800 },
      { _id: '2', title: '微信地球鼠标垫', price: 5800 },
      { _id: '3', title: '微信黄脸大贴纸', price: 500 }
    ]  
  };
};

3、部署云函数

保存云函数代码后，右击"quickstartFunctions"选择“上传并部署：云端安装依赖”，将云函数部署到云端。部署后，云函数将会生成一个唯一的云函数ID，用于在小程序中调用云函数。

4、调用云函数

在小程序中，可以使用wx.cloud.callFunction方法来调用云函数。以下是一个调用云函数的示例：

在调用云函数时，需要指定云函数的名称和传入的参数。云函数执行完成后，会返回一个Promise对象。可以使用Promise的then方法来处理返回结果。

 async fetchGoodsList() {
   
    const res = await wx.cloud.callFunction({
      name: 'quickstartFunctions',
      data: { type: 'fetchGoodsList' },
    });
    
    console.log(res)
    
  }

以上就是一个微信云函数使用的示例。通过使用云函数，可以将小程序的后端逻辑与前端逻辑分离，提高开发效率和代码的可维护性。

五、云存储使用示例

微信小程序的云存储提供了上传和下载文件的功能。以下是使用云存储进行文件上传和下载的步骤：

上传文件： a. 在小程序代码中，使用 wx.cloud.uploadFile 方法上传文件。该方法接受一个 cloudPath 参数，表示文件在云存储中的路径，以及一个 filePath 参数，表示本地文件的路径。 b. 在上传成功的回调函数中，可以获取到文件在云存储中的 fileID，可以把它保存下来，以便后续使用。
下载文件： a. 在小程序代码中，使用 wx.cloud.downloadFile 方法下载文件。该方法接受一个 fileID 参数，表示要下载的文件在云存储中的 ID。 b. 在下载成功的回调函数中，可以获取到下载后的临时文件路径 tempFilePath，可以把它用于展示或其他操作。

需要注意的是，上传和下载文件的前提是已经开通了云开发，并在小程序代码中引入了云开发模块。

以下是一个示例代码，展示了如何使用云存储上传和下载文件：

//上传文件
wx.cloud.uploadFile({
  cloudPath: 'my-image.png',
  filePath: 'local-image.png',
  success: res => {
    console.log('上传成功', res.fileID)
  },
  fail: err => {
    console.error('上传失败', err)
  }
})

// 下载文件
wx.cloud.downloadFile({
  fileID: 'fileID',
  success: res => {
    console.log('下载成功', res.tempFilePath)
  },
  fail: err => {
    console.error('下载失败', err)
  }
})

以上示例中，cloudPath 表示文件在云存储中的路径，filePath 表示本地文件的路径，fileID 表示要下载的文件在云存储中的 ID。

需要注意的是，文件的上传和下载都是异步操作，所以需要在相应的回调函数中处理结果。