大家在做小程序或者客户端开发的时候肯定会想使得数据进行联网,但这样就必须有对应的后台服务器以及数据库,再加上linux运维等各种细节,往往会对新手比较劝退,在这里给大家推荐一种**bass(后端即服务)**,不仅支持小程序,还支持网页端,android,ios多平台调用,支持Java,python,c#等多种语言,最重要的是`懂球帝`的后端就是托管在这个平台上的,安全性有很大的保障
**LeanCloud微信小程序官方接入教程** https://leancloud.cn/docs/weapp.html
微信小程序JavaScript语言数据存储教程 leancloud.cn/docs/leanst…
上来先不管原理,撸一把能直接用的教程
打开LeanCloud控制台网址 leancloud.cn/dashboard/a…
第一步:创建应用
第二步:填写应用相关信息
应用名称必须填写 个人使用的小型的项目就选择开发版
开发版的使用限制:以对象存储为例,其他可查看官方价格说明
具体解释一下每日的总请求数与云端并发线程数
工作线程数指的是服务端可同时处理的请求数量。绝大多数应用需要的服务端工作线程数都不会超过 3 个。
假设服务端响应时间是 20 毫秒,那么每个工作线程每秒钟可以处理 1,000 / 20 = 50 个请求。
一个日活一万的应用,如果每个用户都产生 50 个请求,而且这一万个用户每天都集中在两个小时内打开应用,这两小时内平均每秒钟发生的请求数就是 10,000 × 50 / 2 / 60 / 60 = 69 个,只需要 69 / 50 = 1.15 个工作线程就足以应对这两个小时的请求高峰。
考虑到可能出现的峰值,实际运行的产品应当尽量预留一定的冗余。商用版应用默认拥有 30 个工作线程,足以应对绝大部分需求,如有需要也可以按需调整。
数据 API 每天累计请求超过 30,000 次后,后续的请求会无法得到数据,并返回错误码 429,这个限制每日重置。***
服务端工作线程数 超过 3 时,后续的请求会无法得到数据,并返回错误码 429,这个限制在工作线程数小于 3 时解除。
第三步:可以看到我们创建的应用管理控制台
第四步:在图示界面进行管理
第五步:微信小程序开发工具SDK下载安装
前往 releases.leanapp.cn/#/leancloud… 下载最新版本的 av-weapp-min.js,移动到 libs 目录。
在 app.js 中使用 const AV = require(‘./libs/av-weapp-min.js’); 获得 AV 的引用。在其他文件中使用时请将路径替换成对应的路径。
这里牵扯到的一个问题就是路径问题,这里普及一下路径的表示方法
所以相对于程序代码所在的文件,利用好这个关系一定可以找到对应的路径。
第六步
在 app.js 中使用 const AV = require('./libs/av-weapp-min.js');
获得 AV 的引用
并在app.js
中初始化应用
//app.js
const AV = require('./libs/av-weapp-min.js');
AV.init({
appId: 'Cl2HGjUA2177jyaUblh54MBi-gzGzoHsz',
appKey: '6l8aMu7nsr6wNQau5TmczImP',
});
App({});
第七步
在index.js
中实现对象存储,具体详细的之后再说,我们这里进行一个简单的上传工作在页面加载完成之后
//获取应用实例
const app = getApp();
const AV = require('../../libs/av-weapp-min.js');
Page({
onLoad: function() {
// 生命一个Todo类型
var Todo = AV.Object.extend('Todo'); //Todo即为数据表名称(或类名)
// 新建一个Todo对象
var todo = new Todo();
// set方法:第一个参数为字段名,第二个参数为该字段的值
todo.set('title', '部长会议'); //title为字段名,工程师周会为该字段的值
todo.set('content', '周五晚上8点半');
// 只要添加这一行代码,服务端就会自动添加这个字段
todo.set('location', '507教室');
todo.save().then(function(todo) {
// 成功保存之后,执行其他逻辑.
console.log('New object created with objectId: ' + todo.id);
}, function(error) {
// 异常处理
console.error('Failed to create new object, with error message: ' + error.message);
});
}
})
第八步
实现完上边的功能之后,界面打开代表数据已经上传成功,可以在控制台进行相关的查看
第九步:问题解决
** 如果出现下面问题**
** 找到工具 -> 项目详情 -> 进入**
最后再按照这个域名设置进入我们微信公众平台 -> 小程序 -> 设置 -> 开发设置 -> 服务器域名
第十步上传文件
首先在视图层进行页面代码编写,创建一个按钮,设置一个按钮点击事件upload
<!--index.wxml-->
<view class="container">
<button bindtap='upload'>点击上传图片</button>
</view>
第十一步、js代码中实现按钮点击上传选择图片
//按钮点击事件上传图片
upload: function() {
wx.chooseImage({
count: 9,//最多可选择的图片张数,最多为9张
sizeType: ['original', 'compressed'],//所选图片尺寸,原图、压缩图
sourceType: ['album', 'camera'],//选择图片的来源,从相册选图、使用相机
//接口调用成功的回调函数
success: function(res) {
var tempFilePath = res.tempFilePaths[0]; //图片的本地临时文件路径列表
new AV.File('love', { //调用API接口上传文件,之后进行详细讲解
blob: {
uri: tempFilePath,
},
}).save().then(
file => console.log(file.url())
).catch(console.error);
}
});
}
第十二步:运行小程序,上传图片
第十三步:用户系统一键登录
//界面开始显示时LeanCloud一键登录
onShow: function() {
AV.User.loginWithWeapp().then(user => {
this.globalData.user = user.toJSON();
}).catch(console.error);
},
第十四步:查看用户信息
<button open-type="getUserInfo" bindgetuserinfo="bindGetUserInfo">查看用户信息</button>
//获取用户信息
bindGetUserInfo:function(e) {
console.log(e.detail.userInfo);
}
了解更多技术文章,欢迎关注我的个人公众号
今天的文章微信小程序接入LeanCloud分享到此就结束了,感谢您的阅读。
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。
如需转载请保留出处:https://bianchenghao.cn/15874.html