小程序云开发入门

1、开通云开发服务

点击微信开发者工具的“云开发”图标,在弹出框里点击“开通”,同意协议后,会弹出创建环境的对话框。这时会要求你输入环境名称,以及当前云开发的基础环境配额。
按照对话框提示的要求填写完之后,点击创建,会初始化环境,环境初始化成功后会自动弹出云开发控制台,这样云开发服务就开通了。


2、指定小程序的云开发环境

初次创建的时候在 cloudfunctions 文件夹名显示的不是环境名称,而是“未指定环境”,可以鼠标右键该文件夹,选择“更多设置”,然后再点击“设置”小图标,选择环境并确定。
在开发者工具中打开源代码文件夹 miniprogram 里的 app.js,在 env: 'my-env-id'处改成你的环境 ID。

3、部署并上传云函数

单击cloudfunctions云函数根目录,使用鼠标右键其中的一个云函数目录比如 login,在右键菜单中选择在【终端】中打开,打开后在【终端】中输入以下代码npm install
下载云函数的依赖模块,下载完成后,再右键 login 云函数目录,点击“上传并部署:所有文件”,在云开发控制台点击云函数图标,就能在云函数列表里看到我们上传好的“login”云函数啦。
步骤:

  • 右键云函数目录,选择在终端中打开,输入 npm install命令下载依赖文件;
  • 然后再右键云函数目录,点击“上传并部署:所有文件”
  • 在云开发控制台–云函数–云函数列表查看云函数是否部署成功。
    为什么要在云函数目录执行 npm install?这是因为 npm install 会下载云函数目录下的配置文件 package.json 里的 dependencies,它表示的是当前云函数需要依赖的模块。
    package.json 在哪里,就在哪里执行 npm install

4、获取openid与云函数login

openid 是小程序用户的唯一标识,是每一个小程序用户都有一个唯一的 openid。只有login云函数上传并部署好之后,才能获取到openid。

5、新建云函数

鼠标在cloudfunctions云函数根目录上右键,在弹出的窗口选择“新建Node.js云函数”,比如输入sum,创建出 sum 云函数目录,同时也会在线上环境中创建出对应的云函数(自动部署)。
打开 sum 云函数目录下的 index.js,添加 sum:event.a+event.b,到 return 函数里。然后在index.js上右键选择“云函数增量上传:更新文件”,更新sum云函数。

return { 
    sum:event.a+event.b
}

在服务端并没有声明 a 和 b,这是因为可以在小程序端声明变量。
调用云函数:

testFunction() {
    wx.cloud.callFunction({
      name: 'sum',
      data: {
        a: 1,
        b: 2
      },
      success: res => { 
        console.log('调用云函数:',res) 
      }, 
    })
  }

data 里填写的是传递给云函数的参数,也就是先把小程序端的参数传递给云函数,然后云函数处理之后再返回 res 对象。

6、上传图片

图片上传成功之后,点击云开发控制台的存储图标,就可以进入到存储管理页查看到你之前上传的图片。

// 上传图片
  doUpload: function () {
    // 选择图片
    wx.chooseImage({
      count: 1,
      sizeType: ['compressed'],
      sourceType: ['album', 'camera'],
      success: function (res) {
        wx.showLoading({
          title: '上传中',
        }) 
        const filePath = res.tempFilePaths[0]  
        // 上传图片
        const cloudPath = `my-image${filePath.match(/\.[^.]+?$/)[0]}`  //filePath.match(/\.[^.]+?$/)[0]获取文件后缀名,如.png
        wx.cloud.uploadFile({
          cloudPath,  //文件的云存储路径
          filePath,   //小程序临时存储路径
          success: res => {
            console.log('[上传文件] 成功:', res) 
          }, 
    })
  }

7、wx.cloud属性和方法

  • CloudID: ƒ ( ) //用于云调用获取开放数据
  • callFunction: ƒ ( ) //调用云函数
  • database: ƒ ( ) //获取数据库的引用
  • deleteFile: ƒ ( ) //从云存储空间删除文件
  • downloadFile: ƒ ( ) //从云存储空间下载文件
  • getTempFileURL: ƒ ( ) //用云文件 ID 换取真实链接
  • init: ƒ ( ) //初始化云开发能力
  • uploadFile: ƒ ( ) //上传文件至云存储空间
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 206,126评论 6 481
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 88,254评论 2 382
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 152,445评论 0 341
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 55,185评论 1 278
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 64,178评论 5 371
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,970评论 1 284
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,276评论 3 399
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,927评论 0 259
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 43,400评论 1 300
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,883评论 2 323
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,997评论 1 333
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,646评论 4 322
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,213评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,204评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,423评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,423评论 2 352
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,722评论 2 345