最近开始了新工作，也开始接触到不一样的开发方式以及一些新的知识，其中就有leancloud。事情是这样发生的：
有一天收到了项目的需求文档，里面写着许许多多的后端需求，我的心小小的慌，毕竟作为一个前端，我对后端还是不太熟悉，于是找到公司的大佬问一下，他们纷纷都说这需要后台人员的配合以及搭一个管理员后台，而管理员后台的界面也是需要前端同事搭建...
也许被旧公司养习惯了，觉得要自己搭管理员后台简直浪费人力物力，毕竟长得都差不多样子。后来有一个大佬推荐了一个叫leancloud的工具，说项目的前期没有后端人员的话可以用它实现基本的功能。于是开启了我学习的路程。
注册登录
进入官网注册属于自己的账号以便拿到app-id等重要信息
https://leancloud.cn
创建一个应用
名字随便填都可以， 选择开发版
点击存储进入我们的管理后台
管理数据
期望的数据格式是这样的
{
morning: "go to work",
lunch: "go starbucks",
evening: "go home"
}
- 创建一个Class 名字为
eventList - 选择添加列并填写数据
最后的样子是这样， 前面的id和ACL不需要手动填写
在html与数据做交互
- 在
管理后台→设置→应用key
在这里需要记录下App ID和App Key
这两个值在html中访问必须要用到的 - 新建一个html页面，这里不多说了
引入leancloud的存储服务js, 引入之后会有一个全局变量AV挂载在window上
<script src="//cdn1.lncld.net/static/js/3.6.8/av-min.js"></script>
- 初始化
首先初始化这个AV，APP_ID和APP_KEY需要填入方才拿到的对应值
AV.init({
appId: APP_ID,
appKey: APP_KEY
});
- 注册一个用户在后台_user中
这段代码中的用户信息可以自己设置， 注册只需要运行一次，以后可以根据Username和Password登录
var user = new AV.User();
user.setUsername('user');
user.setPassword('123456');
user.setEmail('123@qq.com');
user.signUp().then(function (loginedUser) {
console.log('成功')
}, (function (error) {
alert(JSON.stringify(error));
}));
查看后台
如果用户数量变为1的话就代表你成功了
- 登录
注册的代码只需要运行一次, 往后想继续操作都可以执行登录
AV.User.logIn('user', '123456').then(function (loginedUser) {
// do something
}, function (error) {
alert(JSON.stringify(error));
});
- 查询
查询我们刚设置的eventList
var query = new AV.Query('eventList');
query.find().then(function (products) {
console.log( products )
}).catch(function(error) {
cnosole.error(JSON.stringify(error));
});
刷新页面后 如果在控制台看到
就证明已经成功从LeanCloud的后台获取数据下来了！
- 提交数据
从html提交一个数据上后台也非常简单
var TestObject = AV.Object.extend('TestObject');
var testObject = new TestObject();
testObject.save({
words: 'test',
fruit: 'Apple'
}).then(function(object) {
console.log('成功');
})
这样做就可以在后台看到一个叫TestObject的类出现
最后，使用leanCloud的一点小感想就是需要依赖第三方，可能在项目初期人手不够或者没有后台人员参与项目的时候用一下，也会遇到一些网络问题导致主要的js加载不出来然后后面一系列都报错..这样的问题还是比较致命，当然在项目发展起来之后果断换掉了leanCloud
网友评论