最近開始了新工作企蹭，也開始接觸到不一樣的開發(fā)方式以及一些新的知識帖烘，其中就有l(wèi)eancloud。事情是這樣發(fā)生的：
有一天收到了項(xiàng)目的需求文檔，里面寫著許許多多的后端需求代兵，我的心小小的慌笛园，畢竟作為一個前端兜挨，我對后端還是不太熟悉退唠，于是找到公司的大佬問一下，他們紛紛都說這需要后臺人員的配合以及搭一個管理員后臺窜醉，而管理員后臺的界面也是需要前端同事搭建...
也許被舊公司養(yǎng)習(xí)慣了宪萄，覺得要自己搭管理員后臺簡直浪費(fèi)人力物力，畢竟長得都差不多樣子榨惰。后來有一個大佬推薦了一個叫l(wèi)eancloud的工具拜英，說項(xiàng)目的前期沒有后端人員的話可以用它實(shí)現(xiàn)基本的功能。于是開啟了我學(xué)習(xí)的路程读串。
注冊登錄
進(jìn)入官網(wǎng)注冊屬于自己的賬號以便拿到app-id等重要信息
https://leancloud.cn
創(chuàng)建一個應(yīng)用
名字隨便填都可以聊记， 選擇開發(fā)版
點(diǎn)擊存儲進(jìn)入我們的管理后臺
管理數(shù)據(jù)
期望的數(shù)據(jù)格式是這樣的
{
morning: "go to work",
lunch: "go starbucks",
evening: "go home"
}
- 創(chuàng)建一個Class 名字為
eventList - 選擇添加列并填寫數(shù)據(jù)
最后的樣子是這樣， 前面的id和ACL不需要手動填寫
在html與數(shù)據(jù)做交互
- 在
管理后臺→設(shè)置→應(yīng)用key
在這里需要記錄下App ID和App Key
這兩個值在html中訪問必須要用到的 - 新建一個html頁面恢暖，這里不多說了
引入leancloud的存儲服務(wù)js, 引入之后會有一個全局變量AV掛載在window上
<script src="http://cdn1.lncld.net/static/js/3.6.8/av-min.js"></script>
- 初始化
首先初始化這個AV排监，APP_ID和APP_KEY需要填入方才拿到的對應(yīng)值
AV.init({
appId: APP_ID,
appKey: APP_KEY
});
- 注冊一個用戶在后臺_user中
這段代碼中的用戶信息可以自己設(shè)置， 注冊只需要運(yùn)行一次杰捂，以后可以根據(jù)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));
}));
查看后臺
如果用戶數(shù)量變?yōu)?的話就代表你成功了
- 登錄
注冊的代碼只需要運(yùn)行一次, 往后想繼續(xù)操作都可以執(zhí)行登錄
AV.User.logIn('user', '123456').then(function (loginedUser) {
// do something
}, function (error) {
alert(JSON.stringify(error));
});
- 查詢
查詢我們剛設(shè)置的eventList
var query = new AV.Query('eventList');
query.find().then(function (products) {
console.log( products )
}).catch(function(error) {
cnosole.error(JSON.stringify(error));
});
刷新頁面后 如果在控制臺看到
就證明已經(jīng)成功從LeanCloud的后臺獲取數(shù)據(jù)下來了舆床！
- 提交數(shù)據(jù)
從html提交一個數(shù)據(jù)上后臺也非常簡單
var TestObject = AV.Object.extend('TestObject');
var testObject = new TestObject();
testObject.save({
words: 'test',
fruit: 'Apple'
}).then(function(object) {
console.log('成功');
})
這樣做就可以在后臺看到一個叫TestObject的類出現(xiàn)
最后，使用leanCloud的一點(diǎn)小感想就是需要依賴第三方嫁佳，可能在項(xiàng)目初期人手不夠或者沒有后臺人員參與項(xiàng)目的時候用一下挨队，也會遇到一些網(wǎng)絡(luò)問題導(dǎo)致主要的js加載不出來然后后面一系列都報錯..這樣的問題還是比較致命，當(dāng)然在項(xiàng)目發(fā)展起來之后果斷換掉了leanCloud
