微信小程序云开发之那些必须的配置

桃扇骨 2022-11-29 05:42 70阅读 0赞

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQzNDc3NzIx_size_16_color_FFFFFF_t_70_pic_center]

###### 用微信开发者工具开发小程序非常的方便。但是里面有几点是需要注意的 ######

*  `项目的目录一定是空文件夹。`
 *  `APPID 可在微信公众平台中获取。如果是云开发的话，记得不要选测试号。不然构建好的项目中，是没有云开发这个选项的。`
 *  `创建好项目之后，点击 云开发 按钮，填好信息，就可以愉快的进行开发了。`
 *  `之后的项目开发中，使用到 云开发时，记得打开这个 云开发，不然调用是会报错的。`
 *  `项目初始化好之后，在根目录下的 app.js中，填写 env: '云环境ID'`

项目目录如下

![在这里插入图片描述][20200819141731235.png_pic_center]

#### 使用云开发之前，要指定云开发环境 ####

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQzNDc3NzIx_size_16_color_FFFFFF_t_70_pic_center 1]  
**这个过程可能需要花费一些时间，请耐心等待。**

**温馨提示：`每次改动云函数都需要同步`**

#### 通过云函数操作云数据库。 ####

*  点击**新建 Node.js 云函数**，就可以建立一个云函数。（每一次改动云函数都需要上传并部署），选中该函数 -> 右键 -> 选择上传并部署（不上传node\_modules），等待上传。上传成功之后，就可以在云函数里面操作云数据库，（小程序云端函数，支持 async 和 await 语法。）

###### 云函数中数据库的初始化 ######

cloud.init()
    const db = cloud.database()
    // 获取数据库中的集合
    const playlistCollection = db.collection('playlist')

*  在云数据库中，新建集合  
    ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQzNDc3NzIx_size_16_color_FFFFFF_t_70_pic_center 2]  
    点击 + 号，即可创建集合（有点类似于 MongoDB吧）
 *  小程序端通过云函数调用云数据库  
    首先在云函数里面安装三个依赖（这个因人而异，我学小程序的时候就是这么操作的）  
    选中一个云函数 -> 右键 -> 在终端打开

"request": "^2.88.2",
    "request-promise": "^4.2.5",
    "tcb-router": "^1.1.2",

安装成功之后，右键 -> 上传并部署（不上传node\_modules）

使用示例

// 云函数入口文件
    const cloud = require('wx-server-sdk')
    cloud.init()
    const db = cloud.database()
    const rp = require('request-promise')
    const URL = 'http://examples'
    
    const playlist = await rp(URL).then((res) => { 
       return JSON.parse(res).result
    })

// 云函数入口文件
    const cloud = require('wx-server-sdk')
    const TcbRouter = require('tcb-router')
    const rp = require('request-promise')
    const BASE_URL = 'http://examples'
    cloud.init()
    
    // 云函数入口函数
    exports.main = async (event, context) => { 
      const app = new TcbRouter({ 
        event
      })
      app.router('playlist', async (ctx, next) => { 
        ctx.body = await cloud.database().collection('playlist')
          .skip(event.start)
          .limit(event.count)
          .orderBy('createTime', 'desc')
          .get()
          .then((res) => { 
            return res
          })
      })
      return app.serve()
    }

小程序端

_getPlaylist() { 
        wx.cloud.callFunction({ 
          name: "music",
          data: { 
            start: this.data.playlist.length,
            count: MAX_LIMT,
            $url: 'playlist'
          }
        }).then((res) => { 
          console.log('playList', res)
        })
      },

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQzNDc3NzIx_size_16_color_FFFFFF_t_70_pic_center]: /images/20221124/4a641fdd79cb46bcaf762323609b06d6.png
[20200819141731235.png_pic_center]: /images/20221124/72d3cfb9998a4c1e8044bbc22a25d3fe.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQzNDc3NzIx_size_16_color_FFFFFF_t_70_pic_center 1]: /images/20221124/131a58a309fe4c4489283db45b06d284.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQzNDc3NzIx_size_16_color_FFFFFF_t_70_pic_center 2]: /images/20221124/423d55f2f1cf48dab92720056e3decf6.png