基于腾讯云开发微信小程序(新闻发布及共享平台)上

简介: 基于腾讯云开发微信小程序(新闻发布及共享平台)上

传统的小程序开发

传统的微信小程序开发需要开发人员购买服务器/域名,部署服务器环境,配置SSL证书,配置服务器信息。业务逻辑上要使用数据库,实现数据接口。购买、搭建和配置这些内容需要花费不少人力物力成本压力大。

以下列出当前开发微信小程序遇到的瓶颈:

1. 需要程序员编写后台代码实现业务逻辑,比如编写最简单的CRUD需要不少代码;

2. 开发过程中需要对数据库进行操作;要求程序员熟悉SQL语句,增加其学习成本;

3. 需要完成会话服务和文件上传保存等工作,需要配置后台服务器,而且安全性不高;

4. 最初的微信小程序是基于API来开发的,开发效率较低;

5. 编写和调试用户登录和微信支付的代码十分复杂。

一、云开发是什么?

1.创建云环境

比如那这个写新闻共享的小程序来说吧,这是我先创建的专门为了写这个小程序的云环境,当然每个云环境都有自己的云环境id,(这里我就不展示哈~)

image.png

2.云数据库的创建

image.png

创建好我们的环境之后,随后我们需要创建一个或者多个云数据库,腾讯云的数据库不像MySQL等数据库一样,腾讯云数据库用json的格式编写,更加条例清晰。

image.png

每添加一条数据都会然你选择默认模式或者json模式,这个可以看自己的选择。

image.png

当我们写好已经创建好的数据库ch12时然后并写好文档id时(当你不写时他会自动给你生成一个随机id),我们点击下方的小加号可以看到由每条记录中的id(名字)+类型+值

image.png

ch12集合中所有的记录如下所示:

image.png

好,我们现在开始说集合的添加

image.png

当我们创建好云环境后,我们来到数据库的选项,点击右上方的小加号:

会弹出如下提示:(我们可以写我们的集合名称!)


image.png

注意:数据权限(当你想让所有的用户都用调用数据库的数据或资源时,我们必须要把数据权限修改,如下):

image.png

3.云储存

好!我们接下来说云储存

image.png

我们点击储存,来到此页面后

image.png

有一个新建文件夹

image.png

我们可以在云储存中创建我们需要存储的静态图片及其他

注意:因为小程序的开发空间有限,所有我们开发时尽量避免用本地的静态资源(图片等),当然在image.png这个里面一般配置的时我们的页面选项图标(如下):

image.png

这里的图标无法配置我们上传到云端的静态资源(图片等)所以我们妖精我们用到的图标尽可能的缩小空间(使用ps等软件)(app.json配置如下):

image.png

好!我们回到我们的云储存来!!

创建好文件夹后会出现在下面(比如我创建了个叫img的文件夹) :

image.png

然后里面我们可以用直接拖动得方式把我们的一些想在小程序上使用的本地资源(图片等)拖入进来(效果如下):

image.png

当我们鼠标放在

image.png

图片的名上时,鼠标的箭头会变成小手状态(待选中)点击后效果如下:

image.png

此时我们看见我们的图片已经自动的生成了一个云端地址:(File ID):


image.png

我们如果想使用此图片到我们的小程序时直接url(cloud://.....)就ok了

当我们想确定是不是想要的图片是点击加载即可显示本图片(如下):

image.png

注意:这样做的好处是可以将图片的储存空间减至最小甚至为零,可以空闲出更多的开发空间供我们的wxml,wxss,js代码书写!

注意:数据权限(当你想让所有的用户都用调用存储中的数据或资源时,我们必须要把数据权限修改,如下):


image.png

4.云函数

好!我们最后说一下云函数(如下所示):

image.png

云函数是用来控制我们要想在小程序中实现点击某个按钮上传什么图片或者其他东西到哪个数据库及点击某个按钮会从某个已经创建好的数据库中获取到某个图片及数据信息!

我们可以看到新建云函数按钮,点击之后(如下):

image.png

当我们起完名字点击确定时,我们的云函数就创建好了!云函数创建好之后他会出现在这个位置(如下):

image.png

刚开始创建的云函数文件夹为白色,这时你的界面右下角会提示(正在上传依赖)我们需要登上十几秒,等我们创建的云函数文件夹变为绿色(说明我们创建的云函数可以正常使用了)

注意:我们在每一次修改云函数中的代码时,每一次修改后都有必须手动上传一遍云端依赖!!!(如下):

image.png

上传并部署!!!当我们点击后,右下角会出现提示(如下):

image.png

上传云端。。。

总结

好!云开发大体就是这个流程,可以参考这个入手微信小程序云开发,等你入坑之后你会发现真的是太好玩了!

微信云开发小程序是全栈(前端and后端)开发的一种形式,他打破了原有的前端+后端(服务器+独立数据库)的束缚,可以让前端人员也能通过简单的学习积累做到全栈开发的能力!!!

目录
相关文章
|
24天前
|
小程序 前端开发 API
微信小程序全栈开发中的异常处理与日志记录
【4月更文挑战第12天】本文探讨了微信小程序全栈开发中的异常处理和日志记录,强调其对确保应用稳定性和用户体验的重要性。异常处理涵盖前端(网络、页面跳转、用户输入、逻辑异常)和后端(数据库、API、业务逻辑)方面;日志记录则关注关键操作和异常情况的追踪。实践中,前端可利用try-catch处理异常,后端借助日志框架记录异常,同时采用集中式日志管理工具提升分析效率。开发者应注意安全性、性能和团队协作,以优化异常处理与日志记录流程。
|
24天前
|
小程序 安全 数据安全/隐私保护
微信小程序全栈开发中的身份认证与授权机制
【4月更文挑战第12天】本文探讨了微信小程序全栈开发中的身份认证与授权机制。身份认证包括手机号验证、微信登录和第三方登录,而授权机制涉及角色权限控制、ACL和OAuth 2.0。实践中,开发者可利用微信登录获取用户信息,集成第三方登录,以及实施角色和ACL进行权限控制。注意点包括安全性、用户体验和合规性,以保障小程序的安全运行和良好体验。通过这些方法,开发者能有效掌握小程序全栈开发技术。
|
24天前
|
小程序 前端开发 JavaScript
微信小程序全栈开发中的PWA技术应用
【4月更文挑战第12天】本文探讨了微信小程序全栈开发中PWA技术的应用,PWA结合Web的开放性和原生应用的性能,提供离线访问、后台运行、桌面图标和原生体验。开发者可利用Service Worker实现离线访问,Worker处理后台运行,Web App Manifest添加桌面图标,CSS和JavaScript提升原生体验。实践中需注意兼容性、性能优化和用户体验。PWA技术能提升小程序的性能和用户体验,助力开发者打造优质小程序。
|
6天前
|
小程序 前端开发 JavaScript
轻松学会微信小程序开发(一)
轻松学会微信小程序开发(一)
|
7天前
|
JSON 小程序 JavaScript
微信小程序开发1
微信小程序开发1
|
16天前
|
小程序 JavaScript Java
基于SpringBoot+Vue+uniapp微信小程序的电子商城购物平台的详细设计和实现
基于SpringBoot+Vue+uniapp微信小程序的电子商城购物平台的详细设计和实现
44 3
|
16天前
|
小程序 JavaScript Java
基于SpringBoot+Vue+uniapp微信小程序的英语学习交流平台的详细设计和实现
基于SpringBoot+Vue+uniapp微信小程序的英语学习交流平台的详细设计和实现
28 2
|
16天前
|
小程序 JavaScript Java
基于SpringBoot+Vue+uniapp微信小程序的移动学习平台的详细设计和实现
基于SpringBoot+Vue+uniapp微信小程序的移动学习平台的详细设计和实现
33 1
|
16天前
|
小程序 JavaScript Java
基于SpringBoot+Vue+uniapp微信小程序的购物系统平台的详细设计和实现
基于SpringBoot+Vue+uniapp微信小程序的购物系统平台的详细设计和实现
29 0
|
24天前
|
监控 前端开发 小程序
微信小程序全栈开发中的前端工程化实践
【4月更文挑战第12天】本文探讨了微信小程序全栈开发中的前端工程化实践,旨在提升开发效率和体验。重点包括代码规范与架构设计(模块化、组件化、MVC模式)、自动化构建与部署(使用Webpack、Git和CI工具)、前端框架与库(如Vue.js、React、Angular)以及性能优化策略(代码、资源优化和性能监控)。通过这些实践,开发者能更高效地掌握小程序开发,打造高质量应用。

热门文章

最新文章