文章缩略图

前端云原生的微信小程序云服务配置详解

2022-06-09 00:00:00 技术教程 12824 阅读需65分钟
图标

本文最后更新于2022-06-09 00:00:00已经过去了1053天 请注意内容时效性

热度 157 评论 0 点赞52
钞能力。你在哪?此处内容已经被作者隐藏,请输入验证码查看内容
验证码:
请关注本站微信公众号,回复“验证码”,获取验证码。在微信里搜索“钞能力。你在哪?”或者“mdyc919293”或者微信扫描右侧二维码关注公众号。

给大家带来了关于微信小程序的相关知识,其中主要介绍了关于云服务的配置详解,包括了创建使用云开发项目、搭建云环境、测试云服务等等内容,下面一起来看一下,希望对大家有帮助。

 

如今云原生已经非常火热,很多伙伴说我们前端领域涉及到云原生么?当然了!今天就来为大家介绍我们最直白的涉及到的云原生,就是我们微信小程序开发中的云函数云存储

创建使用云开发项目

前端云原生-微信小程序云服务配置详解 前端云原生的微信小程序云服务配置详解 技术教程

将AppID填入

选择小程序云开发 创建即可

成功后会为我们呈现一个实例

前端云原生-微信小程序云服务配置详解 前端云原生的微信小程序云服务配置详解 技术教程

刚刚创建的云服务项目中 测试器中有以下错误

前端云原生-微信小程序云服务配置详解 前端云原生的微信小程序云服务配置详解 技术教程

搭建云环境

点击上面的云开发 开通云开发

前端云原生-微信小程序云服务配置详解 前端云原生的微信小程序云服务配置详解 技术教程

开始创建环境

前端云原生-微信小程序云服务配置详解 前端云原生的微信小程序云服务配置详解 技术教程

环境名称自定义

点击确定等待30秒

搭建成功

前端云原生-微信小程序云服务配置详解 前端云原生的微信小程序云服务配置详解 技术教程

成功后不能立即使用前面的错误仍然存在

等待10分钟即可使用

错误消失后 我们连接当前环境(选择我们刚刚配置的demo1)

前端云原生-微信小程序云服务配置详解 前端云原生的微信小程序云服务配置详解 技术教程

测试云服务

1、获取openid(上传本地login云函数)

前端云原生-微信小程序云服务配置详解 前端云原生的微信小程序云服务配置详解 技术教程

点击获取openid 第一次点击时会报错

前端云原生-微信小程序云服务配置详解 前端云原生的微信小程序云服务配置详解 技术教程

右键login文件夹 创建并部署

前端云原生-微信小程序云服务配置详解 前端云原生的微信小程序云服务配置详解 技术教程
前端云原生-微信小程序云服务配置详解 前端云原生的微信小程序云服务配置详解 技术教程

成功后在云开发/云函数中可以看到

前端云原生-微信小程序云服务配置详解 前端云原生的微信小程序云服务配置详解 技术教程

再次查看openid就可以看到了

1.1 创建部署login文件时报错

前端云原生-微信小程序云服务配置详解 前端云原生的微信小程序云服务配置详解 技术教程

可以通过自己在云函数中创建一个login

前端云原生-微信小程序云服务配置详解 前端云原生的微信小程序云服务配置详解 技术教程

创建后再次上传进行覆盖即可

2. 自定义sum函数并创建部署

点击新建云函数

前端云原生-微信小程序云服务配置详解 前端云原生的微信小程序云服务配置详解 技术教程

创建云函数sum

前端云原生-微信小程序云服务配置详解 前端云原生的微信小程序云服务配置详解 技术教程

云函数sum中的index.js更改为以下代码

前端云原生-微信小程序云服务配置详解 前端云原生的微信小程序云服务配置详解 技术教程

  1. // 云函数入口文件
  2. const cloud = require('wx-server-sdk')cloud.init()
  3. // 云函数入口函数
  4. exports.main = async (event, context) => {
  5.   const wxContext = cloud.getWXContext()
  6.  
  7.   return {
  8.     // event,
  9.     // openid: wxContext.OPENID,
  10.     // appid: wxContext.APPID,
  11.     // unionid: wxContext.UNIONID,
  12.     sum:100
  13.   }
  14. }

同样将sum进行部署

前端云原生-微信小程序云服务配置详解 前端云原生的微信小程序云服务配置详解 技术教程

点击测试云函数

前端云原生-微信小程序云服务配置详解 前端云原生的微信小程序云服务配置详解 技术教程

3. 上传图片

点击上传图片

前端云原生-微信小程序云服务配置详解 前端云原生的微信小程序云服务配置详解 技术教程

上传成功 直接上传到云端

前端云原生-微信小程序云服务配置详解 前端云原生的微信小程序云服务配置详解 技术教程

在云开发控制台/储存可以查看图片信息(可以直接使用图片的网络地址)

前端云原生-微信小程序云服务配置详解 前端云原生的微信小程序云服务配置详解 技术教程

4. 前端操作数据库

打开云开发控制台

创建集合(数据库)

前端云原生-微信小程序云服务配置详解 前端云原生的微信小程序云服务配置详解 技术教程

为集合添加数据(更新数据 删除数据 查看数据都是相同操作)

前端云原生-微信小程序云服务配置详解 前端云原生的微信小程序云服务配置详解 技术教程

将上面的注释代码取消注释

点击新增记录

前端云原生-微信小程序云服务配置详解 前端云原生的微信小程序云服务配置详解 技术教程

就在在集合中添加数据

前端云原生-微信小程序云服务配置详解 前端云原生的微信小程序云服务配置详解 技术教程

1是系统自己创建id

2是系统自己创建的用户的信息openid

3是代码中的信息

5. 即时通信demo

添加集合名称为chatroom

前端云原生-微信小程序云服务配置详解 前端云原生的微信小程序云服务配置详解 技术教程

设置增强编译

前端云原生-微信小程序云服务配置详解 前端云原生的微信小程序云服务配置详解 技术教程

开启多账号调试

前端云原生-微信小程序云服务配置详解 前端云原生的微信小程序云服务配置详解 技术教程

选择数量

前端云原生-微信小程序云服务配置详解 前端云原生的微信小程序云服务配置详解 技术教程

确定后可以登录进行聊天

你可能想看:
继续阅读本文相关话题
更多推荐
发表评论

共有[ 0 ]人发表了评论

🥰 😎 😀 😘 😱 🤨 🥵 😔 😤 😡 😭 🥱 🤡 ☠️ 💖 🤖 💢 💥

评论列表
暂无评论

暂时没有评论,期待您的声音!

品牌认证 W3C认证 MYSSL认证 TrustAsia 安全签章
扫码访问手机版
二维码图片