LeanCloud 傻瓜教程

LeanCloud是一個很是好用的數據庫，不要錢並且不要服務器。只須要你會兩點：

1. 基本的JS語法，包括Promise
2. 你瞭解http

若是你不懂，你就看不懂文檔，就不會使用。因此前端要會JS，就是爲了看懂文檔。
面試造飛機，工做擰螺絲就是這個道理，須要你懂得別人的代碼是什麼意思，能看懂別人寫的文檔，本身拿過來會用就能夠了，不須要你去從 0 開始寫。

---

第一部分：建立數據庫

簡單步驟：

1. 建立一個應用 resume-2019
2. 引入 AV-min.js 獲得window.AV
3. 初始化 AV 對象（代碼直接拷）
4. 新建一條數據（代碼直接拷）

---

具體步驟：

以建立一個JS的數據庫爲例

1. 註冊帳號
2. 點擊控制檯-應用-建立應用-（開發者版）-建立成功
3. 進入倉庫-點擊幫助-快速入門（本次按照JavaScript爲例）
4. 選擇開發語言或平臺-選擇 LeanCloud 應用-找到CDN-複製存儲服務代碼放入html中

<script src="//cdn.jsdelivr.net/npm/leancloud-storage@3.14.0/dist/av-min.js"></script>
複製代碼

5. 找到初始化-複製CDN對應的代碼放入<scrpit>···</script>或者新建一個js文件（例如message.js）並放入代碼，同時在html中引入message.js

var APP_ID = 'qwGKSwfSatRWccr9Bc384x9k-gzGzoHsz';// 注意 此處的ID和KEY每一個人每一個庫是不同的
var APP_KEY = 'asxDtkN1cGWq68LzdvM16WUG'; // 請複製你對應的代碼

AV.init({
  appId: APP_ID,
  appKey: APP_KEY
});
複製代碼

6. 找到驗證-在命令行中輸入ping "htgkswfs.api.lncld.net"，確認本地網絡環境是能夠訪問 LeanCloud 服務器。若是當前網路正常將會獲得以下響應：(相似便可)

PING api-ucloud.leancloud.cn (123.59.41.31): 56 data bytes
64 bytes from 123.59.41.31: icmp_seq=0 ttl=51 time=9.032 ms
64 bytes from 123.59.41.31: icmp_seq=1 ttl=51 time=7.290 ms
64 bytes from 123.59.41.31: icmp_seq=2 ttl=51 time=8.131 ms
64 bytes from 123.59.41.31: icmp_seq=3 ttl=51 time=9.689 ms

--- api-ucloud.leancloud.cn ping statistics ---
10 packets transmitted, 10 packets received, 0.0% packet loss
round-trip min/avg/max/stddev = 6.288/7.984/9.689/0.997 ms
複製代碼

7. 在入<scrpit>···</script>或者message.js中加入測試代碼

// 建立TestObject表
var TestObject = AV.Object.extend('TestObject');
// 在表中建立一行數據
var testObject = new TestObject();
// 數據內容是words: 'Hello World!' 保存
// 若是保存成功，則運行 alert('')
testObject.save({
  words: 'Hello World!'
}).then(function(object) {
  alert('LeanCloud Rocks!');
})
複製代碼

而後打開 控制檯 > 存儲 > 數據 > TestObject，若是看到以下內容，說明 SDK 已經正確地執行了上述代碼，安裝完畢。

數據庫完成後，便可在html上增長本身想要的樣式好比form、input等，結合上文代碼就能夠往數據庫裏傳輸信息了。

注意：要監聽form的submit，不要監聽click，監聽form的話，不管用戶是點擊提交按鈕仍是回車，均可以上傳數據；若是監聽click，須要寫更多的代碼才能實現回車上傳數據這個功能，並且輸入框越多代碼越多。

更多的信息，請看LeanCloud文檔。

---

第二部分：調用數據庫

若是你還想把數據庫裏的內容展現在html中，就須要參考LeanCloud 的API文檔了。

例如實現留言板功能，不只要能上傳數據，還要展現數據。

參考LeadCloud 數據存儲開發指南 · JavaScript

使用方法：
目標：獲取數據庫裏全部的數據

1. 獲取對象： 發現不行，由於咱們是本身建立的Message表，不知道它應該get什麼。
2. 批量操做： 發現用find就能夠了。
3. 經過console.log(messages)，發現得到的數組的對象的第一個屬性attributes的第一個屬性就是content，就是咱們想要的數據。

   

OK，任務完成！

這只是一個例子，你學會了如何看文檔，結合必定的JS基礎，就能作出你想要的功能和效果了。