小白如何給網站加個數據庫
阿新 • • 發佈：2018-01-24
取數據 應用 index world! 一個 5.0 api ati .html
需求
我想給我的網站加個留言板
最終效果
瀏覽效果
實現
leancloud.cn
- 在
https://leancloud.cn/註冊一下！ - 登錄後到控制臺，創建應用的服務器
- 開發版的就好，再填個名字，創建
- 得到我們創建的一個應用點進入如圖所示
js的配置
詳細幫助文檔
這裏使用的是js配置 請別忘了勾選js
- 由於是一個個人網站的項目，直接在
index.html中引入
<script src="//cdn1.lncld.net/static/js/3.5.0/av-min.js"></script>初始化
幫助文檔提供了三種形式的屬性規則，分別是es5、es6、服務器
為了保證能夠成功存取數據，確保能夠
ping到服務器ping uziwpzsm.api.lncld.net
加入測試的代碼
var TestObject = AV.Object.extend(‘TestObject‘); // TestObject 為對應的圖3的TestObject var testObject = new TestObject() testObject.save({ words: ‘Hello World!‘ // 存入一個key為words 指為Hello World }).then(function(object) { alert(‘LeanCloud Rocks!‘) // 當存入成功 返回 })
整體js代碼
const appId = ‘XXXXX‘; // 你的appId const appKey = ‘XXX‘; // 你的appKey AV.init({ appId, appKey }); const TestObject = AV.Object.extend(‘TestObject‘); // TestObject 為對應的圖3的TestObject const testObject = new TestObject() testObject.save({ words: ‘Hello World!‘ // 存入一個key為words 指為Hello World }).then((object) => { alert(‘LeanCloud Rocks!‘) // 當存入成功 返回 })
<body>
<section id="message" class="message" >
<h2>Message</h2>
<ul>
</ul>
<form>
<label class="name">
<input type="text" name="name" placeholder="NAME">
<i class="iconfont icon-user"></i>
</label>
<label class="content">
<input type="text" name="content" placeholder="MESSAGE">
<i class="iconfont icon-message"></i>
</label>
<input class="send" type="submit" value="SEND >">
</form>
</section>
</div>
<script src="//cdn1.lncld.net/static/js/3.5.0/av-min.js"></script>
</body>後語
- 當然你也可以把
TextObject改成你自己的命名比如Message
你需要早你的應用裏面創建新的class
- 此方法適用於
小型業務或者個人業務，比如我的留言板。不要用在大型業務，或者你也可以考慮交錢
小白如何給網站加個數據庫